Lack of Ajax query string parameters

Question

Lack of Ajax query string parameters

To implement a functionality where clicking on a delete button in the UI triggers a service method that retrieves data from a database and displays it in a popup, I need to call a specific method in an Action class. The task id and command name (method name) are added to the query string for this purpose. However, when trying to retrieve the command parameter using request.getParameter("command"), it returns null.

I am looking for a JavaScript method to handle this issue.

function ajaxGetDependentTask(id)
{
    try
    {
        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP")  // For Old Microsoft Browsers
    }
    catch (e)
    {
        try
        {
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP")  // For Microsoft IE 6.0+
        }
        catch (e2)
        {
            xmlHttp = false   // No Browser accepts the XMLHTTP Object then false
        }
    }
    if (!xmlHttp && typeof XMLHttpRequest != 'undefined')
    {
        xmlHttp = new XMLHttpRequest();        //For Mozilla, Opera Browsers
    }
    var url = "/admin/TaskEdit.do?id=" + id + "&command=findDependenciesFor";
    xmlHttp.open("GET", url, true);
    xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xmlHttp.onreadystatechange = handleServletResponse;
    xmlHttp.send();
}

The issue lies with the form submission process and the resulting query string being null.

javascript ajax struts-1

Answer 1

Answer №1

If the form has been submitted, the request parameters received by your server will be based on the inputs within the form, not what is written here...

To handle this situation, it is recommended to utilize jQuery and create your own ajax call within the form.submit() function. Remember to add return false; to prevent the form from submitting automatically.

For a more convenient and cross-browser compatible solution, consider using jQuery ajax for sending the AJAX requests:

function fetchDependentTask(id){
  $.ajax({
    url: '/admin/TaskEdit.do',
    type: 'GET',
    data: {
      id: id,
      command: 'findDependenciesFor'
    },
    success: handleResponse,
    error: function(){console.log('An error occurred during the process');}
  });
}
$('#yourButtonId').on('click', function(){
  var id = $(this).val(); // Assuming this is how you retrieve the 'id' for your example code above...
  fetchDependentTask(id);
});
$('#yourFormId').submit(function(){return false;});

Answer 2

If the form has been submitted, the request parameters received by your server will be based on the inputs within the form, not what is written here...

To handle this situation, it is recommended to utilize jQuery and create your own ajax call within the form.submit() function. Remember to add return false; to prevent the form from submitting automatically.

For a more convenient and cross-browser compatible solution, consider using jQuery ajax for sending the AJAX requests:

function fetchDependentTask(id){
  $.ajax({
    url: '/admin/TaskEdit.do',
    type: 'GET',
    data: {
      id: id,
      command: 'findDependenciesFor'
    },
    success: handleResponse,
    error: function(){console.log('An error occurred during the process');}
  });
}
$('#yourButtonId').on('click', function(){
  var id = $(this).val(); // Assuming this is how you retrieve the 'id' for your example code above...
  fetchDependentTask(id);
});
$('#yourFormId').submit(function(){return false;});

Lack of Ajax query string parameters

Answer №1

Similar questions

Using AngularJS to Send Elements to Scripts and Selectors

Use React Router to create a link that goes to the same URL but passes along unique state

Tips for choosing a text node that is a child of a span node

Is it possible to have Vue.js code within a v-for loop in such a way that it executes every time the v-for loop runs?

Is p-queue designed to utilize multiple threads?

Sending data through props to components that can only be accessed through specific routes

How to dynamically generate Angular component selectors with variables or loops?

A Guide to Integrating Cloudinary Upload Widget in React

Using Ajax to create a loading animation

Transitioning from the Play mode to the Pause mode upon pressing the Set button

You are only able to click the button once per day

A guide on updating the color of a Button component (Material UI) when dynamically disabling it

Method Not Allowed: The AngularJS AJAX request received an undefined 405 error

What should the AJAX file in TagManager jQuery look like?

Ways to rejuvenate an angular component

Creating compressed files using JavaScript

Every other time, Django's request.GET.get() method will return None

Using socket.io and express for real-time communication with WebSockets

Building New Web Pages with Express in Node.JS