title: Can't submit a form using DataTables
body: <p>I have a form and when I remove Datatables, it's working properly. But when I put <code>&lt;table id='example'&gt;</code> to use Datatables, it does not submit the form.  If I put <code>echo form_open</code> before ` it doesn't work properly, it inserts only teacher_id=13, but not different for the row, I've chosen. That's my view:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
  &lt;head&gt;
  &lt;link href="//cdn.datatables.net/1.10.5/css/jquery.dataTables.css" rel="stylesheet" type="text/css" /&gt;
  &lt;script src="http://code.jquery.com/jquery-2.0.3.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/jquery-1.11.1.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/jquery-2.1.0.min.js"&gt;&lt;/script&gt;
  &lt;script src="//cdn.datatables.net/1.10.2/js/jquery.dataTables.js"&gt;&lt;/script&gt;
  &lt;script src="//cdn.datatables.net/1.10.2/js/jquery.dataTables.js"&gt;
  &lt;script src="../../media/js/dataTables.editor.min.js"&gt;&lt;/script&gt;
  
  &lt;script&gt;
  $(document).ready(function() {
      $('#example').dataTable( {
          "pagingType": "full_numbers",
           "bSort": true,
           "sDom": 'T&lt;"clear"&gt;lfrtip',
          // "pagingType": "scrolling",
            
            "tableTools": {
      "sSwfPath": "http://cdn.datatables.net/tabletools/2.2.2/swf/copy_csv_xls_pdf.swf",
      "aButtons": [
    "csv",
    
    {
    "sExtends": "pdf",
    "sButtonText": "Print PDF",
    "mColumns": "visible"
    },
    "xls"
  
    ] 
   }
  
  
      } );
  } );
  &lt;/script&gt;
  &lt;script&gt;
  $(document).ready(function() {
      
      $('#example tfoot th').each( function () {
          var title = $('#example thead td').eq( $(this).index() ).text();
          $(this).html( '&lt;input type="text" placeholder="Search '+title+'" /&gt;' );
      } );
   
      
      var table = $('#example').DataTable();
   
      table.columns().eq( 0 ).each( function ( colIdx ) {
          $( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () {
              table
                  .column( colIdx )
                  .search( this.value )
                  .draw();
          } );
      } );
  } );
  &lt;/script&gt;
    &lt;?php
  echo validation_errors();
  
  
  ?&gt;
  &lt;table id='example'&gt;
    &lt;thead&gt;
     &lt;tr&gt;
       &lt;th&gt;Teachers&lt;/th&gt;   
       &lt;th&gt;Coord.&lt;/th&gt;
       &lt;th&gt;Change coord.&lt;/th&gt;
        &lt;th&gt;Deactivate teacher&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;  
    &lt;tfoot&gt;
          &lt;tr&gt;
            &lt;th&gt;Teachers&lt;/th&gt;   
       &lt;th&gt;Coord.&lt;/th&gt;
       &lt;th&gt;Change coord.&lt;/th&gt;
        &lt;th&gt;Deactivate teacher&lt;/th&gt;
          &lt;/tr&gt;
    &lt;/tfoot&gt; 
    &lt;tbody&gt;
      &lt;?php   
  foreach ($teachers_show as $teacher)
  {
  echo form_open('coordinator/deactivate_teacher');  
    ?&gt;
    &lt;tr&gt;
    &lt;td&gt;
    &lt;?php echo $teacher-&gt;username; 
  ?&gt; 
    &lt;/td&gt;
    &lt;td&gt;
    &lt;?php echo $teacher-&gt;coordinator_id;  ?&gt;       
    &lt;/td&gt;&lt;td&gt;
    &lt;?php 
      echo '&lt;a href="edit_coordinator/' . $teacher-&gt;user_id . '" class="btn btn-success" id="change_coord"&gt;  Change &lt;/a&gt;';
  ?&gt;
  &lt;/td&gt;&lt;td&gt;
  &lt;?php 
  echo "&lt;input type='hidden' name='teacher' value='$teacher-&gt;user_id' /&gt;";
  echo '&lt;input type="submit" name="deactivate" value="Деактивирай учител" id="change_coord" class="btn btn-danger" onclick="return confirm(\'Are you sure you want to deactivate?\'); " /&gt;';
  ?&gt;
  &lt;/td&gt;&lt;/tr&gt;
  &lt;?php
  echo form_close();
  
  }
  
  ?&gt;
   
  &lt;/tbody&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>