Search within input elements inside TD AND Newly added text to td html
Search within input elements inside TD AND Newly added text to td html
I have an input text field inside the TD of my table. How can I get the search function of datatables to search the text inside those elements?
The TD looks like this:
[code]
[/code]
I am not sure if this is possible so I wrote some code that updates a hidden in the TD with the value entered in the input
The problem is, it seem that data added to the table after initialized is not searched...
Any ideas how to get the search to look at newly updated data?
My initialization code is as follows:
[code]
$('[id$=pgblk_table]').dataTable( {
"aoColumnDefs": [
{ "bSearchable": false, "aTargets": [ 4 ] },
{ "bSortable": false, "aTargets": [ 0,4 ] }
],
"aaSorting": [[7,'asc']],
"iDisplayLength": 25,
});
[/code]
The TD looks like this:
[code]
[/code]
I am not sure if this is possible so I wrote some code that updates a hidden in the TD with the value entered in the input
The problem is, it seem that data added to the table after initialized is not searched...
Any ideas how to get the search to look at newly updated data?
My initialization code is as follows:
[code]
$('[id$=pgblk_table]').dataTable( {
"aoColumnDefs": [
{ "bSearchable": false, "aTargets": [ 4 ] },
{ "bSortable": false, "aTargets": [ 0,4 ] }
],
"aaSorting": [[7,'asc']],
"iDisplayLength": 25,
});
[/code]
This discussion has been closed.
Replies
[code]
var theRow = this.parentNode.parentNode;
var theTD = this.parentNode;
//Remove the hidden
$('td:eq(9) p', theRow).remove();
//Get existing HTML
var tdHTML = $('td:eq(9)', theRow).html();
.......MISC PLATFORM SPECIFIC STUFF......
//Update the table with the same HTML as before - allows filter to update
oTable.fnUpdate(tdHTML + '' + $(this).val() + '',theRow,9);
//Set value of newly created HTML from update
$('td:eq(9) input', theRow).val($(this).val());
[/code]
This works but.......
It is possible using a method such as this, http://datatables.net/release-datatables/examples/plug-ins/dom_sort.html , but you need to invalidate the input by call fnDraw after you update the value.
As I say, a bit messy at the moment...
Allan
I cannot use the debugger as it give the following error:
A JSON parsing error occured.
Please report to support with a link.
I also cannot use the js.bin as this is a Salesforce page and well, the final output of the html page is not something js.bin can handle....
I do not want to sort using the value, I was the rows to filter based on the value when the user type in the "Search" box...
ie. in the input the user enter TTYY
in the search box the user types TTYY
- only the row with TTYY in the input is visible.
by default, since it is an input, datatables must not know about it because it was not present during initialization.
The solution I wrote above using a hidden field in the same TD works well....
Thanks for you help Allen. much appreciated. I apologize for not being able to use your debugging tools with the salesforce platform....
I realise that, but the two, in DataTables are intrinsically linked. Forcing a re-sort will rebuild the data collection which is then used for the filtering. Look at _fnSort and _fnFilterComplete in DataTables to see how it works, as well as the live DOM sorting plug-ins.
As I say, it is messy and likely not trivial - but ultimately it should be possible.
Allan