jquery - Initiating Datatable Filter when using Javascript to add Text to Input Field -


i using datatables http://www.datatables.net/ table in project.

i want use datatables filter filter out items table based on pre-defined keywords contained within table.

the user can type in filter great, want give them "shortcut" buttons text.

i have working demo here http://jsfiddle.net/vjq5l/4/

you can see when going through buttons - firefox - netscape - osx etc have js working updates value of filter input field.

only problem not filter, need press space on keyboard when focus on input field work.

i sure there might quick solution adding filter call after each button pressed or blur event or something. not sure how it..

http://jsfiddle.net/vjq5l/4/

my js code

$(function() {  /* table initialisation */ $('#example').datatable({     "sdom": "<'row'<'span8'l><'span8'f>r>t<'row'<'span8'i><'span8'p>>",         "olanguage": {         "slengthmenu": "_menu_ records per page"     } });  /* adding filter filter input field */ /* code may not prettiest best can come */              $('a.cmsfilter').click(function(){                 if($(this).text() =="all"){                      $('#example_filter input').val('all')                 }                 else if($(this).text() =="firefox"){                      $('#example_filter input').val('firefox')                 }                 else if($(this).text() =="netscape"){                      $('#example_filter input').val('netscape')                 }                 else if($(this).text() =="osx"){                      $('#example_filter input').val('osx')                 }                 else if($(this).text() =="win"){                      $('#example_filter input').val('win')                 }             });         }); 

i able answer 1 myself, tip 1 of admins @ datatables...

updated fiddle here

http://jsfiddle.net/vjq5l/5/

updated js pasting below.

$(function () {  /* table initialisation */  var otable = $('#example').datatable({     "sdom": "<'row'<'span8'l><'span8'f>r>t<'row'<'span8'i><'span8'p>>",         "olanguage": {         "slengthmenu": "_menu_ records per page"     } });  /* adding filter filter input field */  $('a.cmsfilter').click(function () {     if ($(this).text() == "all") {         otable.fnfilter('');     } else if ($(this).text() == "firefox") {         otable.fnfilter('firefox');     } else if ($(this).text() == "netscape") {         otable.fnfilter('netscape');     } else if ($(this).text() == "osx") {         otable.fnfilter('osx');     } else if ($(this).text() == "win") {         otable.fnfilter('win');     } }); }); 

Comments

Popular posts from this blog

blackberry 10 - how to add multiple markers on the google map just by url? -

php - guestbook returning database data to flash -

java - Using an Integer ArrayList in Android -