Using Datatables in Javascript to search html/php table not working -


i have numerous functions add informtion table (examples shown):

function applyd() {      foreach($_post['select3'] $project1)       {          $project = $_post['select3'];      // set $fromdate entered value if there one, otherwise set long ago $fromdate = $_request["from"] ? $_request["from"] : date("y-m-d", strtotime("-100 years"));  // set $todate entered value if there one, otherwise set tomorrow. there shouldn't finished dates in future! $todate = $_request["to"] ? $_request["to"]: date("y-m-d", strtotime("+1 day"));  // remove hyphens our dates in same format text file , can compare them directly $fromdate = str_replace("-", "", $fromdate); $todate = str_replace("-", "", $todate);   $handle = @fopen("project-list.txt", "r");  while(!feof($handle)) {   $row = fgets($handle);  $col1 = explode ("\t", $row);     if(($col1[0] !== "unfinished")  && ($col1[0] >= $fromdate) && ($col1[0] <= $todate) && strpos($row, $project1) !== false)        {      // or save $row in array write out later echo "<table id='example'>";         echo "<table border=\"5\" cellpadding=\"10\">";         echo "<tr>";         echo $row . "<br />";    }      echo "</tr>";     echo "</table>"; }   fclose($handle); }  }  function applydd()  {       // set $fromdate entered value if there one, otherwise set long ago $fromdate = $_request["from"] ? $_request["from"] : date("y-m-d", strtotime("-100 years"));  // set $todate entered value if there one, otherwise set tomorrow. there shouldn't finished dates in future! $todate = $_request["to"] ? $_request["to"]: date("y-m-d", strtotime("+1 day"));  // remove hyphens our dates in same format text file , can compare them directly $fromdate = str_replace("-", "", $fromdate); $todate = str_replace("-", "", $todate);   $handle = @fopen("project-list.txt", "r");  while(!feof($handle)) {   $row = fgets($handle);  $col1 = explode ("\t", $row);     if(($col1[0] !== "unfinished")  && ($col1[0] >= $fromdate) && ($col1[0] <= $todate))        {      // or save $row in array write out later echo "<table id='example'>";         echo "<table border=\"5\" cellpadding=\"10\">";         echo "<tr>";         echo $row . "<br />";    }      echo "</tr>";     echo "</table>"; }   fclose($handle);    } 

i want user able search keywords in table. have tried use not display results. don't know doing wrong.

<script src ="https://cdn.datatables.net/1.10.7/js/jquery.datatables.min.js"></script> <script> function myfunction(){ var table = $('#example').datatable();  // #myinput <input type="text"> element $('#search').on( 'keyup', function () {     table.search( this.value ).draw(); } ); } </script> 

you're generating tables incorrectly, see corrected code 1 of tables.

also make sure you're specifying <thead> correct number of <th></th> elements corresponding number of columns.

echo '<table id="example" border="5" cellpadding="10">'; echo '<thead><tr><th>col1</th><th>col2</th><th>col3</th></tr></thead>'; echo '<tbody>';  while(!feof($handle)) {     $row = fgets($handle);     $col1 = explode("\t", $row);      if(($col1[0] !== "unfinished")  && ($col1[0] >= $fromdate) && ($col1[0] <= $todate))     {         echo '<tr><td>';         echo implode('</td><td>', htmlspecialchars($row));         echo '</td></tr>';     } } echo '</tbody>'; echo '</table>'; 

also there no need use separate search box , coding jquery datatables provides search box default, see zero configuration example.


Comments