CODEWITHSUNDEEP
javascriptjquery
platypus
platypus

Reputation: 706

JQuery click operation only works once

$("#button_title_delete").click(function(){
    jQuery.ajax({type:'POST', 
            url:'delete.php',
            data: 'id='+$("bid").val(), 
            success: function(veri) { $("#delete_result").html(veri);}
        });
    });

When i click the button with "button_title_delete" id, this function works for only one time. What am i doing wrong? How should i fix this problem?

Upvotes: 1

Views: 745

Answers (2)

gen_Eric
gen_Eric

Reputation: 227310

My guess is that the button is inside of $("#delete_result"). When you do $("#delete_result").html(veri), you are removing the button (and its event), and then making a new button.

You need to make the button have a "live" event. Like so:

$("#delete_result").on("click", "#button_title_delete", function(){
    jQuery.ajax({type:'POST', 
            url:'delete.php',
            data: 'id='+$("bid").val(), 
            success: function(veri) { $("#delete_result").html(veri);}
        });
    });

DEMO: http://jsfiddle.net/pujr8/

Upvotes: 3

Colin Brock
Colin Brock

Reputation: 21575

Probably because you're replacing the button on the success callback of your AJAX function. You need to use jQuery's .on() method to attach the click event.

Upvotes: 5

Related Questions