javascript - html td table search -

the question how perform search in column of table

i use following js script , input tag:

<script type="text/javascript">     function dosearch() {         var searchtext = document.getelementbyid('searchterm').value;         var targettable = document.getelementbyid('datatable');         var targettablecolcount;          //loop through table rows         (var rowindex = 0; rowindex < targettable.rows.length; rowindex++) {             var rowdata = '';              //get column count header row             if (rowindex == 0) {                 targettablecolcount = targettable.rows.item(rowindex).cells.length;                 continue; //do not execute further code header row.             }              //process data rows. (rowindex >= 1)             (var colindex = 0; colindex < targettablecolcount; colindex++) {                 var celltext = '';                  if (navigator.appname == 'microsoft internet explorer')                     celltext = targettable.rows.item(rowindex).cells.item(colindex).innertext;                 else                     celltext = targettable.rows.item(rowindex).cells.item(colindex).textcontent;                  rowdata += celltext;             }              // make search case insensitive.             rowdata = rowdata.tolowercase();             searchtext = searchtext.tolowercase();              //if search term not found in row data             //then hide row, else show             if (rowdata.indexof(searchtext) == -1)                 targettable.rows.item(rowindex).style.display = 'none';             else                 targettable.rows.item(rowindex).style.display = 'table-row';         }     } </script> 

and want modify script search in desired column

change:

for (var colindex = 0; colindex < targettablecolcount; colindex++) { 

to instead use specific column number:

if(colindex<targettablecolcount) //ensures selected column exists 

to colindex number, make dropdown column name text , index value.

<option id="searchid" onchange="updatecolindex()"> <select value="0">column 1</select> <select value="1">column 2</select> </option> <script> var colindex=0; function updatecolindex() {     colindex = document.getelementbyid("searchid").value; } </script>