how can I do range search in individual column search only using datatable
how can I do range search in individual column search only using datatable
SandeepMurala
Posts: 48Questions: 13Answers: 0
Hi ,
I have done range search by using this https://datatables.net/examples/plug-ins/range_filtering.html
and I have done invidival search also like below code
$('#item tfoot th').each( function () {
var title = $(this).text();
$(this).html( '<input type="text" style = "width:70px;" placeholder="'+title+'" />' );
} );
// DataTable
var otable = $('#item').DataTable();
// Apply the search
otable.columns().every( function () {
var that = this;
$( 'input', this.footer() ).on( 'keyup change', function () {
if ( that.search() !== this.value ) {
// alert(this.value);
that
.search( this.value )
.draw();
}
} );
} );
like above induvial seach.
This two scenarios are working fine for me but here I want do that range search in induvial search also like if you take one column like age ,To age we have induvial column search so in that input box if I enter like 20-30 I need to get in between 20 to 30 age rows should get .
I don't want Minimum age and Maximum age two separate input fields out of the table ,I want inside the table only and need to do induvial search and rang search in one input field.
Is it possible or not? ,if it is possible please help on it ,that is appreciated.
Thanks
Sandeep
This question has accepted answers - jump to:
Answers
To enter
20-30in the search input you will still need the range search plugin. You will need to create in input handler specific to the column that can parse the input and store the values in global variables. Then in the search plugin, instead of getting the min and max from the inputs just use the global variables.Kevin
@kthorngren ,
Thanks for you valuable response,
I am sorry i did not get you ,could you source code or any reference .
Please that is helpful for me. I haven't use that much this datatable .
Thanks
Sandeep
I took your code snippets above to create this example:
http://live.datatables.net/tivalozi/1/edit
The search plugin gets the age input and parses it by splitting at
-. If there is no input it simply does areturn true. The rest of the plugin code is the same.In the click events it uses
api column().index()to check if is the Age column. If so just usedraw()for the plugin to run.Kevin
@kthorngren thank you so much for your valuable answer .
@kthorngren, if I want to apply same functionality to another column in the same table along with
AGElikeexperiencetable index is 6. how can I do that one?I tried couple of
if and else conidiationbut I failed.please suggest on it .
Thanks
One option is to create boolean variables for each column then have one return statement at the end that uses all the boolean values to determine if the row is to be shown. I updated the example with a check box to filter only Software Engineers and added that to the search plugin to show what I mean.
http://live.datatables.net/tivalozi/3/edit
Kevin
@kthorngren ,I really thanks to you and appreciated ,
last one question please ,there are some text columns , so how can we do in individual column search comma separated values .
For instance in
OfficecolumnTokyo,London,New Yorkif search this values in I should get result of the search values .Note : along with range search(age column ) it will work .
this is last one i am asking you help on it please ?
Thanks
Sandeep
You can use regular expressions, see example here - if you enter
Tokyo|London" into the Office search, and check "treat as regex". The|` character would need to be the delimiter though, not a comma.Colin