Datatables for numbers

by Faisal Khan Janjua

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<table id="mytable">
  <thead>
    <tr>
      <th>Date/Time</th>
      <th>Serial</th>
      <th>SerialN</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><label>3455100000<input type="radio" name="numbr" value="3455100000"></label></td>
      <td><label>3455100001<input type="radio" name="numbr" value="3455100001"></label></td>
      <td><label>3455100002<input type="radio" name="numbr" value="3455100002"></label></td>
    </tr>
    <tr>
      <td><label>3455100003<input type="radio" name="numbr" value="3455100003"></label></td>
      <td><label>3455100004<input type="radio" name="numbr" value="3455100004"></label></td>
      <td><label>3455100005<input type="radio" name="numbr" value="3455100005"></label></td>
    </tr>
    <tr>
      <td><label>3455100006<input type="radio" name="numbr" value="3455100006"></label></td>
      <td><label>3455100007<input type="radio" name="numbr" value="3455100007"></label></td>
      <td><label>3455100008<input type="radio" name="numbr" value="3455100008"></label></td>
    </tr>
    <tr>
      <td><label>3455100009<input type="radio" name="numbr" value="3455100009"></label></td>
      <td><label>3455100010<input type="radio" name="numbr" value="3455100010"></label></td>
      <td><label>3455100011<input type="radio" name="numbr" value="3455100011"></label></td>
    </tr>
    <tr>
      <td><label>3455100012<input type="radio" name="numbr" value="3455100012"></label></td>
      <td><label>3455100013<input type="radio" name="numbr" value="3455100013"></label></td>
      <td><label>3455100014<input type="radio" name="numbr" value="3455100014"></label></td>
    </tr>
    <tr>
      <td><label>3455100015<input type="radio" name="numbr" value="3455100015"></label></td>
      <td><label>3455100016<input type="radio" name="numbr"...

CSS

table{
  border-collapse: collapse !important;
  width:100%;
}
td{
  border:1px solid #333;
}
thead{
  display:none;
}
@media only screen and (max-width: 767px) {
  td{
    width:100%;
    display:block;
  }
}

JavaScript

$(function() {
  $('#mytable').DataTable();
});