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

SandeepMuralaSandeepMurala Posts: 48Questions: 13Answers: 0
edited December 2021 in General

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

  • kthorngrenkthorngren Posts: 20,425Questions: 26Answers: 4,794

    To enter 20-30 in 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

  • SandeepMuralaSandeepMurala Posts: 48Questions: 13Answers: 0

    @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

  • kthorngrenkthorngren Posts: 20,425Questions: 26Answers: 4,794
    Answer ✓

    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 a return 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 use draw() for the plugin to run.

    Kevin

  • SandeepMuralaSandeepMurala Posts: 48Questions: 13Answers: 0
    edited December 2021

    @kthorngren thank you so much for your valuable answer .

  • SandeepMuralaSandeepMurala Posts: 48Questions: 13Answers: 0

    @kthorngren, if I want to apply same functionality to another column in the same table along with AGE like experience table index is 6. how can I do that one?

    I tried couple of if and else conidiation but I failed.

    please suggest on it .

    Thanks

  • kthorngrenkthorngren Posts: 20,425Questions: 26Answers: 4,794

    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

  • SandeepMuralaSandeepMurala Posts: 48Questions: 13Answers: 0

    @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 Office column Tokyo,London,New York if 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

  • colincolin Posts: 15,177Questions: 1Answers: 2,590
    Answer ✓

    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

Sign In or Register to comment.