Jquery-Tabellensortierung arbeitet nicht mit Eingabe-Checkbox

Question

Ich benutze Jquery Table-Sorter und es funktioniert in allen Fällen, außer wenn eine der Spalten ein Eingabe-Kontrollkästchen ist. Wenn ein Eingabe-Kontrollkästchen vorhanden ist, hat keine der Spalten in der Tabelle sort.I versucht, die Eingabe in eine Schaltfläche zu ändern, aber ich kann das Kontrollkästchen nicht aktivieren (ich denke, dass das etwas mit dem Label zu tun haben könnte) Tag), aber die Spalten sortieren.

Ich habe überall nach einer Lösung gesucht, kann aber keine finden, jede Hilfe wird sehr geschätzt.

<div class="container"> 
     <div class="row"> 
      <div class="cols s12"> 

       <div id="searchtable1">  
        <table class="sortable responsive-table bordered highlight">   
        <thead>   
         <tr> 
          <th ></th>      
          <th >Username</th> 
          <th >First Name</th> 
          <th >Last Name</th>      
         </tr> 
        </thead>       
        <tbody> 
         <tr id="${count}"> 
          <td> 
           <%-- <input type="checkbox" value="1" id="checkbox1" name="checkbox1"> --%> 
           <button type="checkbox" value="1" id="checkbox1" name="checkbox1"></button> 
           <label for="checkbox1"></label> 

          </td> 
          <td></td> 
          <td></td>  
          <td></td> 
         </tr> 
        </tbody> 
       </table> 
      </div> 
     </div> 
    </div> 
</div> 


<script language="JavaScript" type="text/javascript"> 
    $(document).ready(function() { 
     $('#searchtable1').dataTable().sort(); 
    }); 
</script> 

Dies ist eine JSP-Seite und ich verwende das CSS Materialize Stylesheet.

Wenn Sie mich wissen lassen können, warum die Schaltfläche Kontrollkästchen nicht funktioniert oder warum die Eingabe-Checkbox nicht die Tabelle sortiert, die wäre toll.

Answer 1

Nach vielen Stunden des Elends, ist das Problem in der CSS materialisieren Stylesheet. Es funktionierte nicht, weil die <td></td> nicht in der gleichen Zeile war. So ist der korrekte Code und Abstand:

<tr id="${count}"> 
    <td><input type="checkbox" value="1" id="checkbox1" name="checkbox1"><label for="checkbox1"></label></td> 
    <td></td> 
    <td></td>  
    <td></td> 
</tr>