JavaScript vs. GSP: Exploring How to Trigger a Grails Action

There is an action in a controller that I need to modify.

def deleteFiling={
  obj.removeFiling()
  redirect(action:"list")

}

This action is triggered from a GSP:

<g:link action="deleteFiling" id="${filingInstance.id}"> <img src="${resource(dir:'images',file:'trash.gif')}" title="Delete" />

When this action is called, it performs a database query and then redirects to the main page with a success message.

However, I now want the GSP to call a different action that involves some JavaScript functionality like displaying a popup confirmation message before executing the deleteFiling action.

I am attempting something using Ext JS:

Ext.MessageBox.show({
    title:'Commit Confirmation',
    msg: 'You are about to <strong>Delete</strong> the entire <strong>Filing</strong>. This \n action cannot be reversed within the form PF application. \n\nAre you sure you want to Proceed',
    buttons: Ext.MessageBox.YESNO,
    fn: processDelete,
    icon: Ext.MessageBox.QUESTION
});
function processDelete(btn, text){
    $.ajax({
           url : appContextRoot + '/filing/deleteFiling'
           //success:mySuccessFunction 
    });
}

The issue I am facing is that when I use an ajax call to trigger the action, the database query is executed but the redirection does not happen.

On the other hand, when I directly call the action from the GSP, the redirection works fine. I am wondering what could be causing this difference between calling an action through an ajax call from JavaScript versus calling it directly from the GSP?

Answer №1

When working with GSP tags, it's important to differentiate between calling actions using ajax versus making a direct GET request. If you opt for the latter approach, the entire page will be refreshed upon calling the action.

On the other hand, utilizing ajax allows the response of the action to be rendered into an object. This enables you to manipulate the DOM and display the result of the action without needing to refresh the entire page.

Alternatively, you can invoke the action using javascript without utilizing ajax:

function processDelete(btn, text){
    loacation.href="${createLink(action: 'deleteFiling')}";
}

Answer №2

If you're working with Grails, you have the ability to invoke a specific action using JavaScript like this: userId and viewId serve as parameters for the action.

Here's an example of how to create a function called closeAgentPopup that takes a userId as an argument:

function closeAgentPopup(userId){

window.location.href="${createLink(action:'profile', controller:'agent')}"+'/'+userId+'?viewId=0';

}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Retrieving information from a JSON object in Angular using a specific key

After receiving JSON data from the server, I currently have a variable public checkId: any = 54 How can I extract the data corresponding to ID = 54 from the provided JSON below? I am specifically looking to extract the values associated with KEY 54 " ...

Exploring the wonders of LoopBack querying

Discovering loopback has been an enlightening experience for me. However, as I delve deeper into its functionalities, I've stumbled upon something unexpected. I noticed that when executing queries, such as using the updateAll method, if a parameter i ...

Is it possible to prevent the selected option from being available in other select lists using AngularJS?

Can anyone help me figure out how to disable an option in one select list when it is selected in another using AngularJS? I have set up a select list for From Year and To Year with ng-repeat, which is working fine. Now, I just need to implement the functio ...

Retrieve user input from an HTML form and pass it as a parameter in a jQuery AJAX request

Is there a way to pass a value from a user input in an HTML file to jQuery.ajax? Take a look at the code snippet from my JS file: jQuery(document).ready(function() { jQuery.ajax({ type: 'POST', url: 'myurl.asp ...

What is the best way to stop div animations when clicking with jQuery?

Upon loading the page, a div animates automatically. There is also a button present. When the button is clicked, I would like to create a new div and animate it the same way as the first one. However, when this happens, the position of the first div also ...

Utilizing AngularJS ng-messages feature across various languages

Utilizing ng-messages to show error messages for form validation in my application. I have a multi-language app, how can I implement ng-messages to support multiple languages? HTML Form <div class="messages" ng-messages="myForm.email.$error"> & ...

Why isn't my output being shown on the screen?

Why is the output (refresh value) not being displayed? function myFunction() { $a = document.getElementById("examplehtml").value; document.write("<big><bold>"); document.write($a); document.write("</bold></big>"); $b = ...

jQuery.clone() Internet Explorer issue

I have a scenario where I use jQuery.clone() to extract the html of a page and then append it to a pre tag. Surprisingly, this operation works perfectly fine in Firefox and Chrome, but there's no response when it comes to IE: <!DOCTYPE html> &l ...

Creating a factory class in Typescript that incorporates advanced logic

I have come across an issue with my TypeScript class that inherits another one. I am trying to create a factory class that can generate objects of either type based on simple logic, but it seems to be malfunctioning. Here is the basic Customer class: cla ...

React does not display the items enclosed within the map function

I am facing an issue with rendering elements from a map function. Despite trying to modify the return statement, I have not been able to resolve the issue. class API extends Component { myTop10Artists() { Api.getMyTopArtists(function (err, data) { ...

Sending information from popup to primary controller wit the use of AngularJS - (Plunker example provided) with an autocomplete field embedded in the popup

My scenario is a bit unique compared to passing regular data from a modal to the main controller. The input field in my modal has an autocomplete feature. Here is the Plunker I have included for reference: http://plnkr.co/edit/lpcg6pPSbspjkjmpaX1q?p=prev ...

Creating a display of divs that flow from left to right in each row, and then stacking the rows from bottom to top using CSS and jQuery

My current dilemma involves a collection of divs that must be displayed in a specific order, but with a rather intricate layout. Essentially, this is the structure of my HTML: <div> <div class="box">1 (first in list)</div> <di ...

What is the best way to transform an Object {} into an Array [] of objects with varying structures?

Within my javascript code, I am working with an object structure like this: let obj= { a: { a1: [5,5], a2: [6,6] }, b: { a1: [7,7], a2: [8,8] }, c: { a1: [9,9], a2: [3,3] } } The goal is to ...

What is the best way to set the page title on a server-rendered component when using the Next.js app router?

When loading a blog post from the server, I have access to details like the title of the post. However, based on the app router migration guide, this information is located outside my page. How can I update it? For more information, refer to the documenta ...

How can I retrieve the elements that have been removed using $pull in mongoose?

Currently, I am utilizing $pull to eliminate a subdocument from an array within a document. It may be pertinent to note that the subdocuments in my case contain _id and are therefore indexed. Here is the JSON schema description: user: { _id: Strin ...

What is the best method to consistently convert a deeply nested object into a tabular format that can be easily reversed

Imagine having a deeply nested object with an unknown structure until runtime, like: { "row-0" : { "rec-0" : { "date" : 20220121, "tags" : [ "val-0" ] }, ...

Is it possible to link click and onchange events?

My code includes a function that updates an empty array and displays content in two separate HTML elements each time a radio button is selected from a select list. The content is displayed in a div and a ul element. Additionally, I want to display more rad ...

byte sequence displays as binary data (angular + express)

I've been working on pulling files from a back-end Node.js / Express server and displaying them in an Angular front-end. Despite trying different methods, I keep facing the same issue - the data displayed at the front-end appears as a bytestring. Even ...

Is it possible to generate a unique name from an array without any repeats?

Update: I am not looking to create a single list, but rather a button that generates a random name when clicked. Objective: Generate a random name from an array by clicking a button. The goal is to display one name at a time randomly without repetition. W ...

Comparing values inputted from JavaScript using PHP

I am passing values from PHP to a script. <img src=\"images/add.jpg\" onclick='add_program_user(".$value['id_program'].",".$value['min_age'].",".$value['max_age'].")' onmouseover=\"this.style.curso ...