You are viewing limited content. For full access, please sign in.

Question

Question

Datatables Plug-in

asked on September 4, 2019 Show version history

So, I've been browsing on here looking through every shred of content on how to make this work, but I just can't seem to get it. I'm trying to use the Datatables plug-in to sort the tables on Forms. I've got it to a point where I can see the various functions (Sort the column, search, show a certain amount of rows, etc.) but as soon as I click any of them it clears the data in the table.

now I've been thinking maybe the CSS and JS are running which is why it displays, but the data doesn't make it to the table specified which is why it clears. Or maybe I'm way off. 

So what I'm looking for is someone who has any experience with the Datatables plug-in and if you've got it to work somehow.

 

Also, I should note that I've read and tried the result in this question, and it didn't work any better than what I did myself. Also, I noticed in this post that it seems like the poster got it to work by using a custom HTML table.

Anything that anyone may know that could even point me in the right direction to at the very least figure it out on my own would be so appreciated. Thanks.

0 0

Replies

replied on September 5, 2019

Hi Tanner,

Applying the Datatables plugin to the Forms out-of-the-box table did not work for us since the plugin required a specific html format. Instead, you can copy the data from the Forms table to a custom html table that matches the required html format. The required html format is fairly standard. You can check this out from the following link and clicking the HTML tab.

https://datatables.net/examples/data_sources/dom

There is a custom event called "lookupcomplete" which you can use in JS. This event handler gets triggered once your lookup is finished. Once your lookup is complete, store the number of rows from your Forms table into a variable, create a for-loop that transmits the data to your custom html table, and then apply the Datatables plugin to your custom html table.

$(document).on('lookupcomplete',function(){ 

//copy data from your Forms table to your custom html table and apply plugin

})

If you want lazy loading, you need to implement a stored procedure. With this approach, you need a hidden field that keeps track of the row range to display. Hitting the next or previous button changes the row range, which gets passed to your stored procedure. 

 

Datatables.PNG
Datatables.PNG (78.48 KB)
1 0
replied on September 5, 2019 Show version history

Note: there might be a way to apply the DataTabeles plugin directly to your out-of-the-box Forms table with some HTML dom manipulation, although I haven't tried this approach

0 0
replied on September 6, 2019

Ok. That makes sense. Thank you. I'm going to try it out and see what I can get. I might also look into the DOM manipulation also, I hadn't thought about it.  Thanks, Kentaro!

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.