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

Top tips for writing JavaScript that incorporates an AJAX call to determine whether the default action should be blocked

Utilizing JavaScript and jQuery, I am developing a handler for form submission that will either allow or prevent the form from being submitted based on certain conditions. Although this task is fairly straightforward, it becomes more complex due to the ne ...

Error message 'Object doesn't have support for this property or method' is triggered by a basic JSON object

Recently, I developed a compact framework for loading resources asynchronously (hyperlink). The framework functions properly in modern browsers such as Opera, Chrome, and Firefox. However, when testing it in IE8, the code fails to execute. Internet Explor ...

Issue encountered in Vite Preview: Uncaught (in promise) SyntaxError: JSON.parse found an unexpected character at the beginning of the JSON data, line 1 column 1

Encountering the error message Uncaught (in promise) SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data when running vite preview after running vite build. Here is my vite.config.js: import { defineConfig } from "vite&q ...

Turn off automatic downloading of embedded frame content in Safari for iOS

I am encountering an issue with a modal that displays a PDF and offers two options - one to print and one to download. The download option uses a blob with content-type: application/octet-stream, while the print option utilizes a blob with content-type: a ...

Returning a 404 Error stating "Invalid request to /api/users/register."

Encountering an issue with proxy connection - unable to determine the root cause despite verifying all routes. Not able to successfully register the user and store data in MongoDB. Seeking suggestions for resolution. Thank you. Attempting to send user reg ...

Guide to incorporating a jade file into a node.js application after executing an Ajax request

While working on my node.js application, I encountered an issue with loading a new HTML file using Ajax on a button click. Despite everything else working perfectly, the new HTML file was not being loaded. This is how I am making the ajax call in my main. ...

How to showcase base64 encoded images in pug (jade) with node.js

Can anyone help with decoding this mysterious data and displaying the image? I'm using pug as my template engine. Below is the questionable data that needs to be shown as an image: /9j/4AAQSkZJRgABAQEAYABgAAD/4QBaRXhpZgAATU0AKgAAAAgABQ ...and so f ...

Expanding Java Classes and Replacing Methods with Multiple Parameters in ES4X/Graal

I am currently facing a challenge in my JavaScript project using ES4X/Graal, where I need to extend a Java class. This Java class has methods with overloaded parameters that I must override. While I understand how to call a specific Java method by specifyi ...

Elegant switch in jQuery

I am trying to use jQuery to create an animated toggle button. The toggle function is working correctly, but I am having trouble adjusting the speed and smoothness of the animation. After researching different methods and attempting to modify the values i ...

JS receiving a reference to an undefined variable from Flask

I referenced this helpful post on Stack Overflow to transfer data from Flask to a JS file. Flask: @app.route('/') def home(): content = "Hello" return render_template('index.html', content=content) HTML <head> ...

Is there a way to retrieve the current logged in user when working with socket.io?

When it comes to retrieving the logged in user using passport.js in most of my routes, it's a breeze - just use req.user.username. However, I've encountered an issue with a page that relies solely on websockets. How can I determine the username o ...

Are there specific mathematical algorithms that lend themselves well to creating responsive HTML designs?

Tired of constantly guessing the percentage values to use with a specific number of divs and other elements in my design. I am looking to understand the mathematical calculations that determine the scaling required for different elements in order to main ...

Setting up a retrieval callback in mongoose and storing it in a global variable

Is there a way to set the value of db as a global variable? I am having trouble with getting the console output of name outside of the findOne function, it keeps showing me undefined. Any suggestions on how to fix this issue? var name; schema.findone({na ...

JavaScript: Receiving an error that function is undefined when working with data binding

Why is my code showing that it's not defined while I'm attempting a simple code with data binding? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="ht ...

The disappearing act of Redux state after being added to a nested array

When attempting to update my redux state, I am facing an issue where the state disappears. My approach involves checking for a parentId - if one exists, I insert the payload into the parent's children array. However, if no parentId is provided, I simp ...

Querying MongoDB findAndModify: <<< locate and modify an object within an array in a document

Question : I am attempting to locate an object within a document's array and make updates to it. The syntax below provides me with the desired object, but I am unsure of how to update it. I attempted to use this query in findAndModify, but it seems ...

Modify the color of every element by applying a CSS class

I attempted to change the color of all elements in a certain class, but encountered an error: Unable to convert undefined or null to object This is the code I used: <div class="kolorek" onclick="changeColor('34495e');" style="background-c ...

Tips for choosing and deselecting data using jQuery

Is there a way to toggle the selection of data in my code? Currently, when I click on the data it gets selected and a tick image appears. However, I want it so that when I click again on the same data, the tick will disappear. How can I achieve this func ...

Unable to generate onsen-ui popover

My expertise lies in utilizing the Monaca platform for developing mobile applications using Onsen UI and AngularJS. I am looking to incorporate a popover feature from Onsen into my app, and have tried the following code snippet: angular.module('app& ...

Is it possible to refresh the chat-box using PHP?

I recently created a chat box application using PHP, but I'm facing an issue with its automatic reload functionality. Is there a way to implement auto-reload in PHP itself, or would it be better to restructure the system to utilize AJAX? Additionally, ...