CODEWITHSUNDEEP
jqueryasp.netjquery-plugins
thedevlpr
thedevlpr

Reputation: 1101

Objects in jquery DataTable only work for the first page

I am building a web app using ASP.net and using jQuery DataTable plugin to create my tables from information I retrieve from my database. I populate the tables just fine with the correct information the only problem is that any object such as submit buttons won't behave correctly after page 1. This only happens for one of the aspx pages that I am using while it works perfectly fine in the other one. Even though they are pretty much the exact same thing except for one less column and of course the content within each cell of the table.

I know there are solutions to this such as using live() and binding those buttons but how would I do that for labels and other objects? To be more clear, when I try to style labels from this table it only applies to the first page so it's like DataTables doesn't recognize all the other elements apart from page 1.

Upvotes: 0

Views: 766

Answers (1)

thedevlpr
thedevlpr

Reputation: 1101

So after a couple of hours of trying to find ways around this by binding each element with .live or .on event I found a solution, do all your styling and modifications to elements BEFORE you initialize the dataTable.

In my case, let's take the objective to style a label on the condition that it's value either equals 'Connected' or 'Not Connected' after querying the database.

Before I do this.... 

var oTable = $('#tblWebsites').dataTable({
        "aoColumnDefs": [
            { "bSortable": false, "aTargets": [0] }
        ],
        'sPaginationType': 'full_numbers',
        "aaSorting": [[1, 'asc']],
        "iDisplayLength": 2,.......});

I call a function to check for each of my labels and style them using a conditional. Works perfectly! This also works for any other elements that might require some user manipulation such as textareas.

Hope my solution helps anyone with any similar future situations!

Upvotes: 1

Related Questions