Using the AJAX loading method with an ID stored in a JavaScript variable

Question

Using the AJAX loading method with an ID stored in a JavaScript variable

Hey there! Could someone please explain how I can use the AJAX load method to load a div whose ID is stored in a JavaScript variable? In other words, the div that needs to be loaded has its ID saved as a JavaScript variable.

I'm facing an issue where I can't add quotes around the JavaScript variable containing the div's ID. The load method doesn't work unless I include quotes around the div ID.

function submitFormByAjax(obj){
    // The ID of the div to be loaded is stored here. 
    // I don't know the value - it could be anything 
    var divid = $(obj).attr("id"); 
    $.ajax({ type: 'post',
        url: 'home_formhandler1.php',
        data: currentform.serialize(),
        success: function() {
            $("#" + divid).load("home.php #" + divid);
        }                   
    });
}

This code isn't functioning correctly. It seems like JavaScript is treating the variable divid as a string.

javascript ajax

Answer 1

Answer №1

When the div is already passed in as obj, there is no need to use the ID at all. Here's a revised version of the code:

function submitFormByAjax(obj){

   $.ajax({ 
      type: 'post',
      url: 'home_formhandler1.php',
      data: currentform.serialize(),
      success: function() {
         $(obj).load("home.php");
      }                   
   });
}

Using $(obj) achieves the same result without having to extract and later utilize the div's ID.

Answer 2

When the div is already passed in as obj, there is no need to use the ID at all. Here's a revised version of the code:

function submitFormByAjax(obj){

   $.ajax({ 
      type: 'post',
      url: 'home_formhandler1.php',
      data: currentform.serialize(),
      success: function() {
         $(obj).load("home.php");
      }                   
   });
}

Using $(obj) achieves the same result without having to extract and later utilize the div's ID.

Using the AJAX loading method with an ID stored in a JavaScript variable

Answer №1

Similar questions

Save information in a session using html and javascript

What is the best way to determine if an item qualifies as an Angular $q promise?

Creating a glowing shimmer using vanilla JavaScript

Validating user input fields to display error messages when empty

Even after configuring a proxy, the API calls are still not being redirected to the correct destination

Combining two classes into a single class using ‘this’ in JavaScript

What is the best way to connect tags with their corresponding tag synonyms?

Difficulty Loading Static JavaScript File in Express.js

Change the background color of a MUI ToggleButton based on a dynamic selection

What is the step-by-step process for incorporating the `module` module into a Vue project?

Why is the jQuery change event only firing when the page loads?

Top recommendation: Utilizing Typescript to allow a customer to enhance an application using their own tailored code

How can "this" be properly utilized in jQuery?

What is the method for installing particular versions or tags of all npm dependencies?

The new pop-up window appears smaller than expected in Internet Explorer

React hooks causing the for loop to only work on the second iteration

Utilizing Local Storage in Vuex Store with Vue.js

Focus is lost on React input after typing the initial character

Encountering issue with Konva/Vue-Konva: receiving a TypeError at client.js line 227 stating that Konva.Layer is not a

Is it possible to run an existing NextJS app with API routes on a mobile platform using either Capacitor or Expo?