click function in datatables action menu

Question

js output:

$(document).ready(function() {

        $('#datatable').dataTable({
            "bProcessing": true,
            "bServerSide": true,
            "sPaginationType": "full_numbers",
            "sAjaxSource": "includes/list.php",
            "sServerMethod": "POST"

        });


        $('.deleteRow').click(function() {
            alert("wait...");
        });


});

server-side php output:

<tr class="odd">
<td class="">lorem ipsum</td>
<td class="">lorem ipsum</td>
<td class="">lorem ipsum</td>
<td class="">lorem ipsum</td>
<td class="">lorem ipsum</td>
<td class=""><a class="deleteRow">delete</a></td>
</tr>

when i click delete no alert..

but when i put this delete link in my page manuelly (not php output) function working good..

PSR · Accepted Answer · 2013-06-13 13:15:24Z

1

Elements which will come after the page loaded you need to use .on()

       $(document).on('click','.deleteRow',function() {
            alert("wait...");
        });

edited Jun 13, 2013 at 13:15

answered Jun 13, 2013 at 13:10

PSR

40.4k43 gold badges115 silver badges154 bronze badges

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

3 Comments

wirey00 Over a year ago

Just because they are dynamic doesn't mean they need to use the delegated form of .on() - though it's probably the best way - but you can always bind after the elements exist in the dom ^.^

wirey00 Over a year ago

I didn't downvote - your answer will fix his problem though - I gave you a +1

PSR Over a year ago

But some persons dont have any wrk .They are doing like this with out any comment

Prashobh · Accepted Answer · 2013-06-13 13:22:56Z

1

Use Delegate

$(document).on('click','.deleteRow',function() {
            alert("testing");
        });

edited Jun 13, 2013 at 13:22

answered Jun 13, 2013 at 13:12

Prashobh

9,58415 gold badges65 silver badges92 bronze badges

2 Comments

wirey00 Over a year ago

this does the same exact thing as the OP's element.click(function() - read the first sentence from the .click() documentation This method is a shortcut for .on('click', handler)

Prashobh Over a year ago

i updated the answer ,sorry for the mistake ,thanks for the corection

Simon · Accepted Answer · 2013-06-22 21:04:11Z

0

Try this:

$('.deleteRow').on('click', function() {
     alert("wait...");
});

Edit: As others have said, the correct way is...

$(document).on('click', '.deleteRow', function() {
     alert("wait...");
});

edited Jun 22, 2013 at 21:04

answered Jun 13, 2013 at 13:10

Simon

2,8312 gold badges20 silver badges24 bronze badges

3 Comments

wirey00 Over a year ago

this does the same exact thing as the OP's element.click(function()- read the first sentence from the .click() documentation This method is a shortcut for .on('click', handler)

Simon Over a year ago

ahh yes. I always mix the syntax up for that. I guess this syntax is working for me because I'm using knockoutjs and have a dom element already present? Thanks for the correction.

wirey00 Over a year ago

Yes, as long as the element is present at the time of binding then it will work with no problem.. Delegation allows for you to bind to an ancestor(higher up) element - which will listen for the event as they bubble up to it and handle it there. Therefore the element getting the event handler bound to it must also exist and be static

Collectives™ on Stack Overflow

click function in datatables action menu

3 Answers 3

3 Comments

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related