Why does yadcf DataTables plugin filter functionality break with iterating data from a database?

Question

I am having an issue with the yadcf datatables plugin. I have created a table with three columns as shown in the screenshot: Image shows the Snapshot of the table and its data

I have created some web code in the editor. Problem is when i try to iterate from the mysql database into a table. The column filtration breaks. What could be the problem? `

  <?php
        mysql_connect('locahost','xxx','xxx');
        mysql_select_db('db1');
        $result = mysql_query('select * from `test_table` group by `instanceID`');


  ?>


  <table cellpadding="0" cellspacing="0" border="0" class="display" id="tab1">
       <thead>
          <tr>
              <th>Scheme</th>
              <th>Team_ID</th>
              <th>Names</th>
          </tr>
        </thead>
        <tbody>

          <?php
               $rows = mysql_num_rows($result);
               while($r = mysql_fetch_object($result)){
            ?>
              <tr class="odd gradeX">
                 <td><?php echo $r->Scheme; ?></td>
                 <td><?php echo $r->Team_ID;; ?></td>
                 <td><?php echo $r->FarmerName1; ?></td>
              </tr>

             <?php } ?>
          </tbody>
      </table>

Answer 1

According to data provided by you the following js code should work for you

$(document).ready( 
    $('#tab1').dataTable().yadcf([
        {column_number : 0, filter_default_label: "Select scheme"},
        {column_number : 1, filter_default_label: "Select team"},
        {column_number : 2, filter_default_label: "Select name"} ]); 
);

There is no need to use column_data_type: "html", html_data_type: "text" in your case because the data inside your <td> is a plain text and not html elements