Event listener gets removed on post method

Question

After I click on a th with the class database-header, my table gets sorted via the post method, but for some reason the click event listener gets removed, so when I click again on a different database-header, nothing happens. What em i doing wrong ?

$(function () {
    var user = $('#user');
    var databaseHeader = $('.database-header');
    var tableContainer = $('.table-container');
    var databaseHeaderValue;
    var url = './php/table.php';

    databaseHeader.click(function () { 
/* Checks for the user login div */
        if (user.closest('html').length){ 
            databaseHeaderValue = $(this).html();
            $.post(url, {'sort' : databaseHeaderValue}, function (data) {
                tableContainer.html(data);
            });
        }
    });
});

`$(document).on('click' , databaseHeader. , function (){})` – Mohamed-Yousef May 08 '17 at 23:42 — Mohamed-Yousef, May 08 '17 at 23:42

score 1 · Answer 1 · answered May 08 '17 at 23:43

1

Try changing your jquery click like below:

var user = $('#user');
var databaseHeader = '.database-header';
var tableContainer = $('.table-container');
var databaseHeaderValue;
var url = './php/table.php';

$(document).on('click', databaseHeader, function () { 
    /* Checks for the user login div */
    if (user.closest('html').length){ 
        databaseHeaderValue = $(this).html();
        $.post(url, {'sort' : databaseHeaderValue}, function (data) {
            tableContainer.html(data);
        });
    }
});

answered May 08 '17 at 23:43

Mahesh Singh Chouhan

2,558
1
16
26

Works like a charm :D, thanks a lot ! – Mahir May 08 '17 at 23:48
Thanks, you can mark this answer as useful, so that it helps others too :) – Mahesh Singh Chouhan May 08 '17 at 23:49
Got no reputation sadly , just registered xD – Mahir May 08 '17 at 23:51
You can not upvote but you can mark this as useful, i believe – Mahesh Singh Chouhan May 08 '17 at 23:52

score 0 · Answer 2 · answered May 08 '17 at 23:42

0

Do you only refresh a part of the page? After a DOM element is added dynamically, you cannot grab it with a jquery selector.

try

$(body).on("click", ".database-header",function(){
etc..
}

answered May 08 '17 at 23:42

Milney

6,253
2
19
33

Event listener gets removed on post method

2 Answers2