Change Columns Data after AJAX search
Change Columns Data after AJAX search
kevinjt
Posts: 10Questions: 1Answers: 0
Hello, I have a datatable like the following:
var table_customer = $('#table_customer').DataTable({
"dom": "ltip",
"colReorder": true,
"bAutoWidth": false,
'processing': true,
'serverSide': true,
'serverMethod': 'post',
'ajax': {
'url':"http://localhost:8000/search",
'data': function(data){
var search_string = $('#customsearch').val();
data.search_string = search_string;
}
},
'columns': [{ title: 'Title 1', data : 'Data1'},
{ title: 'Title 2', data : 'Data2'},
{ title: 'Title 3', data : 'Data3'},
{ title: 'Title 4', data : 'Data4'},
{ title: 'Title 5', data : 'Data5'},
{ title: 'Title 6', data : 'Data6'},
{ title: 'Title 7', data : 'Data7'},
{ title: 'Title 8', data : 'Data8'},
{ title: 'Title 9', data : 'Data9'},
{ "data" : null, "orderable" : false, "defaultContent": '<form action="http://localhost:8000/customer/aaa" method="post" class="form_delete_customer"><button type="button" href="javascript:void()" onclick="confirm(\'Confirm delete this customer?\') ? this.parentElement.submit() : \'\'" class="btn btn-danger delete-customer">Delete</button></form>'
}
]
});
Is there a way for me to change Data1 to Data9 dynamically after AJAX search depending on the column order in AJAX result? For example, Title 1 corresponds to Data9, Title 2 corresponds to Data8 and so on.
Thank you
This question has an accepted answers - jump to answer
Answers
There's no way to flip it as such, but
rowCallbackis called each time a row is drawn - you could create a function in there to flip over the data values as required,Colin
p.s. apologies for you having to post twice, the spam filter took offence to your posts for some reason.
Thank you for your fast response. What is the command to set the columns data inside rowCallback? I tried these to try to set only the first column:
But both of these do not change anything.
This is an example here - http://live.datatables.net/hoduhule/1/edit - it's changing the second column to be date/time when the column was drawn. Hopefully that'll help!
Colin
Hi Colin,
I tried to switch Data1 and Data2 so 'Title 1' corresponds to Data2 and 'Title 2' corresponds to Data1 using this code inside rowCallback:
After I performed a search, I was able to change 'Title 1' to correspond to Data2. However, 'Title 2' now also corresponds to Data2. I also debug the code and the value of field 'Title 2' is also Data2 even though during the first iteration, the original value was Data1. Is there anything I'm doing wrong?
Thank you,
Kevin
I might not be understanding what you are trying to do but if you want to swap two values you wouldn't use a loop. You would just save the two values to swap then apply them to their new columns. Like this:
http://live.datatables.net/jocaxehe/1/edit
Kevin
Hello kthorngren,
I'm trying to show the search result while preserving the column order of the search result. When the webpage first loaded, the column may be in sequence. However, after searching, the order of column retrieved from database may be changed.
But it seems that after I declared the columns.data, then I cannot change the order of the column values. Is this correct?
Thank you
Maybe this will help:
Setting
columns.datais set only at initialization. If you need to change the order of the columns then the Datatable needs to be reinitialized.Instead of returning object based data maybe you can return array based data and not use
columns.data. This way Datatables will display the column order based on the order returned not the order defined at initialization. Like this server side example.Kevin
Hi kthorngren,
I ended up calling a separate ajax to detect whether there are changed in the column order. If there are changes, I retrieve the new column order results then place this result inside columns.data & then reinitialise the table.
Now it works as I wanted. Thanks for your suggestion!
Kevin
Hi kthorngren,
I ended up calling a separate ajax to detect whether there are changed in the column order. If there are changes, I retrieve the new column order results then place this result inside columns.data & then reinitialise the table.
Now it works as I wanted. Thanks for your suggestion!
Kevin