CODEWITHSUNDEEP
jquerydatatables
pankaj
pankaj

Reputation: 474

Jquery datatables: How to search only selected options inside html select field

I have a html multi select field in one column of jquery datatable(http://datatables.net), I want to search(from its default search box) only selected options in select fields and not unselected ones . Its currently searching all the text inside select field.

What I would need is to remove unselected options from search.

Can anyone suggest how to do it ?
Thanks.

Edit: I have created custom sType and defined $.fn.dataTableExt.ofnSearch for it. As specified at- (http://datatables.net/development/filtering) in "Type based column filtering". Code is Given below:- 

$.fn.dataTableExt.aTypes.push(
    function ( sData )
    {
        var ishtml=sData.match(/<select(?:.)*?>.*<\/select>/gm);


        if (ishtml)
        {
            return 'comments';
        }
        return null;
    }
);

$.fn.dataTableExt.ofnSearch['comments'] = function ( sData ) {
   return sData.replace(/<select(?:.)*?>.*<\/select>/gm, "");
}

And added stype to columndef in .dataTable( { } ) 

"aoColumnDefs": [{ "sType": "comments", "aTargets": [ 8 ] }],

It will remove complete select element text (selected and unselected both)from search. Then I will use jquery to add selected options to hidden div outside of select to let them available in search. But this is still considering select field text in search.

Any ideas? Please let me know if any one can help.

Upvotes: 1

Views: 3866

Answers (1)

Stefan
Stefan

Reputation: 14863

You can use fnFilter to search for if the checkbox contains the term checked or not. How to use fnFilter is discribed here: jQuery DataTables - Filter column by exact match

oTable.fnFilter( "^"+TERM+"$", COLUMN , true); //Term, Column #, RegExp Filter

So in your table you can filter for:

//all unchecked boxes
table.fnFilter('^((?!checked).)*$', COLUMN, true);    
//all checked boxes       
table.fnFilter('checked', COLUMN, true);

(COLUMN is for the column where the checkbox is ;)), true is for enabling Regex search (must be enabled for search unchecked boxes, option for checked ones, since we are not using a regex here).

PS: I'm uncertian this is the best method, but it definitly works

Upvotes: 1

Related Questions