jquery .click function not working after load

Question

I have made a jquery function which will change status to complete if pending .

The function is executing properly on first button click and it is loading my table changing my status to complete.

But on second time on button click it is not reading the function.

Here is my jquery code:

 $('a.success_btn').click(function(e){
          e.preventDefault();
        var id = $(this).attr('id');
        var status = "completed";
        $.ajax({
            type: "POST",
            url: "includes/vorder.php",
            data:{ o_id: id, o_status: status }, 
            success: function(data){
                alert(data);
                $('#all_order').load('orders.php #all_order');
            }
        })  
      });

Here:

a.success_btn = button class name

'#all_order'= my order table div id

The table is on another php page means '#all_order' and it has been included to this page.

A. Wolff · Accepted Answer · 2016-02-25 16:51:30Z

1

You should delegate event as following:

$('#all_order').on('click', 'a.success_btn',function(){
   /*( ͡° ͜ʖ ͡°)*/
});

answered Feb 25, 2016 at 16:51

A. Wolff

74.4k9 gold badges98 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

mohammad haris Over a year ago

actuall #all_order is on another php page , so jquery function will not read this id I guess. Have updated my question.

Collectives™ on Stack Overflow

jquery .click function not working after load

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related