When trying to sort or page, the processing bar covers the table but never goes away, even after the data is returned. I can see the returned json in the xhr window but it doesn't refresh the table.
If that response you posted is after sorting or paging then the problem seems to be with the "draw":1. The draw parameter, as explained in the SSP docs is a sequence number. For each draw Datatables increments the parameter so I would expect the Request from the client will have a draw parameter value above 1 once you start paging, searching or storing. Your server script needs to respond with the draw value that was sent to it.
So with the revised code that I added from this thread I now only get the variables explicitly in the url sent to the server instead of the whole data table payload. Therefore, the draw variable will only be included if I make it part of the url which still leaves me with no data on the columns or sorting.
So with the revised code that I added from this thread I now only get the variables explicitly in the url sent to the server instead of the whole data table payload.
Assuming you still have serverSide: true and using the -ajax.data function to convert the parameters to a JSON string I created this example to show the request parameters are sent: http://live.datatables.net/rosejayi/1/edit
There is no response because the server expects the default format of the parameters.
Using POST removes the Datatabe server side parameters from the URL but the are still sent but its sent as formData. Your server script will need to process the POST formData instead of the URL parameters.
The gethttprequestdata() function in ColdFusion accesses those form variables passed by the datatable when using a post request. I almost have it all working now.
So I have sorting and searching working. I'm down to my last major issue. Each row needs a custom button for editing the row. The edit url information is encrypted on the backend before being added to the data being sent back to datatables.
The problem is that the created button, since it is built through datatables, doesn't have the onClick event attached to it that it had when we were doing this client side. How can I attach the event once the data is passed back to datatables?
With some editing that does work except if there are two buttons in the same tr. Then they both get the same buttonURL added to the end. Using .each doesn't fix it.
$('#'+thisID + ' tbody').on('click', 'tr', function (e) {
e.preventDefault();
var row = this;
$(row).find("button").each(function() {
var button = this;
editRecordURL = '/editUser.cfm?' + $(button).attr('buttonURL');
window.location = editRecordURL;
});
});
Is it possible to do that with an unknown number of buttons?
The problem I'm running into is that they want this to be a single piece of code that will work on different reports that may have one or more buttons, possibly more than two.
Its just standard Javascript and jQuery methods you need to use. There is nothing specific to Datatables. You will need to find a way to define the buttons so you know which one is clicked. Take a look on Stack Overflow for ideas that might work for your situation. For example this thread might ive you some ideas.
Answers
Post the following information:
"columns" : columns,post the contents of thecolumnsvariableKevin
Init code:
Columns
Request
Response
```
{"draw": 1,
"recordsTotal": 9999,
"recordsFiltered": 8888,
"arguments": {"active":1,"datamismatch":0,"disabled":0,"draw":1,"header":"0","inactive":0,"length":10,"nolls":0,"order":null,"search":"","sc":"","start":0,"s":"1646848138836","hasHrRep":"false","hasManager":"false","isAdmin":"true","hasSupervisor":"false"},
"data": [
You posted the request URL. I asked for the Request parameters, for example:
Everything looks ok. Did this not work? If not what happened?
Kevin
When trying to sort or page, the processing bar covers the table but never goes away, even after the data is returned. I can see the returned json in the xhr window but it doesn't refresh the table.
Request parameters
You posted the response not the request
If that response you posted is after sorting or paging then the problem seems to be with the
"draw":1. Thedrawparameter, as explained in the SSP docs is a sequence number. For each draw Datatables increments the parameter so I would expect the Request from the client will have adrawparameter value above1once you start paging, searching or storing. Your server script needs to respond with thedrawvalue that was sent to it.Kevin
The data I posted above is from the Request Payload window. The server is setting the draw response to the same value as what it receives.
Sorry, you are right - I didn't look close enough. Please post a request payload and response to show the issue when you page or sort.
Kevin
So with the revised code that I added from this thread I now only get the variables explicitly in the url sent to the server instead of the whole data table payload. Therefore, the draw variable will only be included if I make it part of the url which still leaves me with no data on the columns or sorting.
Assuming you still have
serverSide: trueand using the-ajax.datafunction to convert the parameters to a JSON string I created this example to show the request parameters are sent:http://live.datatables.net/rosejayi/1/edit
There is no response because the server expects the default format of the parameters.
Can you post a link to your page or a running test case showing the issue so we can help debug?
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin
I figured out that having the method set to "post" removes the data tables payload. I'll work on this some more and let you know.
Using POST removes the Datatabe server side parameters from the URL but the are still sent but its sent as formData. Your server script will need to process the POST formData instead of the URL parameters.
Kevin
So if I do a post request, I lose all of the data tables payload. If I change it to a get request, I get a 400 error for unexpected characters.
Okay. I'll try that.
The gethttprequestdata() function in ColdFusion accesses those form variables passed by the datatable when using a post request. I almost have it all working now.
So I have sorting and searching working. I'm down to my last major issue. Each row needs a custom button for editing the row. The edit url information is encrypted on the backend before being added to the data being sent back to datatables.
The problem is that the created button, since it is built through datatables, doesn't have the onClick event attached to it that it had when we were doing this client side. How can I attach the event once the data is passed back to datatables?
Server side build for each row button:
Existing datatables jquery code:
The existing onClick function that no longer is working:
```
Use delegated events as shown in this example.
Kevin
With some editing that does work except if there are two buttons in the same tr. Then they both get the same buttonURL added to the end. Using .each doesn't fix it.
I also tried this, pulling the url builder outside but it doesn't seem to grab the buttons with the binder class.
External function:
Buttons:
Use something like this example:
http://live.datatables.net/xijecupo/1/edit
Use a classname or input name attribute to distinguish between the buttons with your click event.
Kevin
Is it possible to do that with an unknown number of buttons?
The problem I'm running into is that they want this to be a single piece of code that will work on different reports that may have one or more buttons, possibly more than two.
Its just standard Javascript and jQuery methods you need to use. There is nothing specific to Datatables. You will need to find a way to define the buttons so you know which one is clicked. Take a look on Stack Overflow for ideas that might work for your situation. For example this thread might ive you some ideas.
Kevin
The trick was to wrap the function in the following. Thank you for all the help getting me to here.