Footable-v3-DataName-Example

Showing a Footable v3 DataName wo rking

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fooplugins.github.io/FooTable/compiled/footable.bootstrap.min.css">
<script src="https://fooplugins.github.io/FooTable/compiled/footable.js"></script>
<table class="table footable">
  <thead>
    <tr>
      <th data-toggle="true">
        First Name
      </th>
      <th>
        Last Name
      </th>
      <th>
        Job Title
      </th>
      <th data-breakpoints="xs">
        DOB (Visible)
      </th>
      <th data-breakpoints="all" data-name="Date Of Birth">
        DOB (hide)
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        John 1st
      </td>
      <td>
        Mayer
      </td>
      <td>
        Musician
      </td>
      <td>
        10/16/1977
      </td>
      <td>
        10/16/1977
      </td>
    </tr>
    <tr>
      <td>
        John 2nd
      </td>
      <td>
        Mayer
      </td>
      <td>
        Musician
      </td>
      <td>
        10/16/1977
      </td>
      <td>
        10/16/1977
      </td>
    </tr>
    <tr>
      <td>
        John 3rd
      </td>
      <td>
        Mayer
      </td>
      <td>
        Musician
      </td>
      <td>
        10/16/1977
      </td>
      <td>
        10/16/1977
      </td>
    </tr>
</tbody>
</table>

JavaScript

$(function () {

  $(".footable").footable({
 	breakpoints: { // The different screen resolution breakpoints
   	phone: 480,
   	tablet: 1024
   }
});