CODEWITHSUNDEEP
jquery
user4490434
user4490434

Reputation:

I can't get a div to reload on click without reloading the entire page

I know that there are other posts like this but after going through them I still can't figure out how to use ajax to reload a div on my page without refreshing the entire page.

Upvotes: 0

Views: 1365

Answers (3)

rolspace
rolspace

Reputation: 335

In order to make this work you must include the URL that will provide the response you are trying to load into your div.

$( "#cart" ).click(function() {
    $( "#drawer-indiv-product" ).load( "some-url.html #drawer-indiv-product");
});

This is from the load() documentation: http://api.jquery.com/load/, the URL parameter is required.

Edit: You can use something like this to find out more about the data you are receiving:

$( "#cart" ).click(function() {
    $( "#drawer-indiv-product" ).load( "some-url.html #drawer-indiv-product", function(response, status, xhr) {
        if (status == "error") {
            console.log(xhr.status + " " + xhr.statusText);
        }
        else {
            console.log(response);
        }
    }
});

Upvotes: 1

shukshin.ivan
shukshin.ivan

Reputation: 11340

Use load correctly. In addition add return false in the end of onclick. It will prevent common link behavior - reloading page.

Upvotes: 0

mic4ael
mic4ael

Reputation: 8290

You are using the load method incorrectly. According to the documentation you can load a fragment from the remote document but in order to do that you need to use the correct syntax. For example:

$( "#drawer-indiv-product" ).load("/resource/load.html #drawer-indiv-product");

Upvotes: 1

Related Questions