CODEWITHSUNDEEP
javascriptjqueryajax
Hugo
Hugo

Reputation: 767

After running an AJAX call, jquery code does not execute

I have a website which uses pagination, and some filtering with jQuery and AJAX. All works well up until the point I changed my links to Javascript links.

Being on the homepage and not having used any filtering or pagination all works as expected. After I have used pagination or a filtering (effectively using an AJAX call for both) my JavaScript links do not work anymore.

The JavaScript for the link is:

$(function(){
    $( ".artikel_box_lk .button" ).click(function( e ) {
        window.open( "/lk/" + $( this ).attr("rel"), "_blank");
    });
});

And the code for the pagination:

function loadData(page){                   
    loading_show();
    $.ajax
    ({
        type: "POST",
        url: "php/load_data.php",
        data: dataToSend,
        success: function(msg)
        {
            $("#container").ajaxComplete(function(event, request, settings)
            {   
                loading_hide();
                $("#container").html(msg);                          
            });
        }
    });
}

My guess is that the javascript does not get reloaded on the AJAX call as only part of the page is reloaded, but I am unsure if this is the case and on how to fix this.

Upvotes: 0

Views: 568

Answers (2)

Pranav Singh
Pranav Singh

Reputation: 20091

Seems your javascript is not loaded after postback. Try adding your function inside pageLoad on Webpage like :

function pageLoad()
{
    $( ".artikel_box_lk .button" ).click(function( e ) {
        window.open( "/lk/" + $( this ).attr("rel"), "_blank");
    });
}

Upvotes: 1

Suresh Atta
Suresh Atta

Reputation: 121998

Do event delegation 

 $( "#container" ).on ("click",".artikel_box_lk .button" ,function( e ) {
        window.open( "/lk/" + $( this ).attr("rel"), "_blank");
    });

Upvotes: 0

Related Questions