AdminLTE Datatables not applying style to label











up vote
0
down vote

favorite












So I am trying to create a datatable using adminlte template:






var tblCardHistory;
tblCardHistory = $("#cardhistorynew-table").DataTable({
"deferRender": true,
"paging": true,
"lengthChange": true,
"searching": true,
"ordering": true,
"info": true,
"autoWidth": true,
columns: [
{ data: "emp_id" },
{ data: "name" },
{ data: "card_no" },
{ data: "change_time" },
{ data: "change_date" }
]
});

<link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<div class="box-body">
<div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
<div class="row">
<div class="col-sm-12">
<table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
<thead>
<tr role="row">
<th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
<th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
<th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
<th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
<th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
</tr>
</thead>
<tbody>
<!-- rows -->
</tbody>
</table>
</div>
</div>
</div>
</div>





It is applying the style correctly and all. Then I try to implement searching, paging, etc.



It would apply the style correctly except for the search and show..entries label:



enter image description here



Sorry if I'm missing something very obvious here. Need help ;m;










share|improve this question




























    up vote
    0
    down vote

    favorite












    So I am trying to create a datatable using adminlte template:






    var tblCardHistory;
    tblCardHistory = $("#cardhistorynew-table").DataTable({
    "deferRender": true,
    "paging": true,
    "lengthChange": true,
    "searching": true,
    "ordering": true,
    "info": true,
    "autoWidth": true,
    columns: [
    { data: "emp_id" },
    { data: "name" },
    { data: "card_no" },
    { data: "change_time" },
    { data: "change_date" }
    ]
    });

    <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <div class="box-body">
    <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
    <div class="row">
    <div class="col-sm-12">
    <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
    <thead>
    <tr role="row">
    <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
    <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
    <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
    <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
    <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
    </tr>
    </thead>
    <tbody>
    <!-- rows -->
    </tbody>
    </table>
    </div>
    </div>
    </div>
    </div>





    It is applying the style correctly and all. Then I try to implement searching, paging, etc.



    It would apply the style correctly except for the search and show..entries label:



    enter image description here



    Sorry if I'm missing something very obvious here. Need help ;m;










    share|improve this question


























      up vote
      0
      down vote

      favorite









      up vote
      0
      down vote

      favorite











      So I am trying to create a datatable using adminlte template:






      var tblCardHistory;
      tblCardHistory = $("#cardhistorynew-table").DataTable({
      "deferRender": true,
      "paging": true,
      "lengthChange": true,
      "searching": true,
      "ordering": true,
      "info": true,
      "autoWidth": true,
      columns: [
      { data: "emp_id" },
      { data: "name" },
      { data: "card_no" },
      { data: "change_time" },
      { data: "change_date" }
      ]
      });

      <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
      <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
      <div class="box-body">
      <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
      <div class="row">
      <div class="col-sm-12">
      <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
      <thead>
      <tr role="row">
      <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
      </tr>
      </thead>
      <tbody>
      <!-- rows -->
      </tbody>
      </table>
      </div>
      </div>
      </div>
      </div>





      It is applying the style correctly and all. Then I try to implement searching, paging, etc.



      It would apply the style correctly except for the search and show..entries label:



      enter image description here



      Sorry if I'm missing something very obvious here. Need help ;m;










      share|improve this question















      So I am trying to create a datatable using adminlte template:






      var tblCardHistory;
      tblCardHistory = $("#cardhistorynew-table").DataTable({
      "deferRender": true,
      "paging": true,
      "lengthChange": true,
      "searching": true,
      "ordering": true,
      "info": true,
      "autoWidth": true,
      columns: [
      { data: "emp_id" },
      { data: "name" },
      { data: "card_no" },
      { data: "change_time" },
      { data: "change_date" }
      ]
      });

      <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
      <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
      <div class="box-body">
      <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
      <div class="row">
      <div class="col-sm-12">
      <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
      <thead>
      <tr role="row">
      <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
      </tr>
      </thead>
      <tbody>
      <!-- rows -->
      </tbody>
      </table>
      </div>
      </div>
      </div>
      </div>





      It is applying the style correctly and all. Then I try to implement searching, paging, etc.



      It would apply the style correctly except for the search and show..entries label:



      enter image description here



      Sorry if I'm missing something very obvious here. Need help ;m;






      var tblCardHistory;
      tblCardHistory = $("#cardhistorynew-table").DataTable({
      "deferRender": true,
      "paging": true,
      "lengthChange": true,
      "searching": true,
      "ordering": true,
      "info": true,
      "autoWidth": true,
      columns: [
      { data: "emp_id" },
      { data: "name" },
      { data: "card_no" },
      { data: "change_time" },
      { data: "change_date" }
      ]
      });

      <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
      <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
      <div class="box-body">
      <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
      <div class="row">
      <div class="col-sm-12">
      <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
      <thead>
      <tr role="row">
      <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
      </tr>
      </thead>
      <tbody>
      <!-- rows -->
      </tbody>
      </table>
      </div>
      </div>
      </div>
      </div>





      var tblCardHistory;
      tblCardHistory = $("#cardhistorynew-table").DataTable({
      "deferRender": true,
      "paging": true,
      "lengthChange": true,
      "searching": true,
      "ordering": true,
      "info": true,
      "autoWidth": true,
      columns: [
      { data: "emp_id" },
      { data: "name" },
      { data: "card_no" },
      { data: "change_time" },
      { data: "change_date" }
      ]
      });

      <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
      <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
      <div class="box-body">
      <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
      <div class="row">
      <div class="col-sm-12">
      <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
      <thead>
      <tr role="row">
      <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
      </tr>
      </thead>
      <tbody>
      <!-- rows -->
      </tbody>
      </table>
      </div>
      </div>
      </div>
      </div>






      jquery html css datatables adminlte






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited 4 hours ago









      phuzi

      4,39011835




      4,39011835










      asked 4 hours ago









      Akii

      637




      637
























          2 Answers
          2






          active

          oldest

          votes

















          up vote
          0
          down vote













          You need to put something like the following in your HTML... (immediately after the dataTables_wrapper DIV)



          <div class="row">
          <div class="col-sm-6">
          <div class="dataTables_length" id="example1_length">
          <label>Show
          <select name="example1_length" class="form-control input-sm" aria-controls="example1">
          <option value="10">10</option>
          <option value="25">25</option>
          <option value="50">50</option>
          <option value="100">100</option>
          </select> entries</label>
          </div>
          </div>
          <div class="col-sm-6">
          <div class="dataTables_filter" id="example1_filter">
          <label>Search:<input class="form-control input-sm" aria-controls="example1" type="search" placeholder=""></label>
          </div>
          </div>
          </div>


          Hope this help?






          share|improve this answer




























            up vote
            0
            down vote













            use bootstrap.min.css in style. look for code snippet.






            var tblCardHistory;
            tblCardHistory = $("#cardhistorynew-table").DataTable({
            "deferRender": true,
            "paging": true,
            "lengthChange": true,
            "searching": true,
            "ordering": true,
            "info": true,
            "autoWidth": true,
            columns: [
            { data: "emp_id" },
            { data: "name" },
            { data: "card_no" },
            { data: "change_time" },
            { data: "change_date" }
            ]
            });

            <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>

            <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">


            <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
            <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
            <div class="box-body">
            <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
            <div class="row">
            <div class="col-sm-12">
            <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
            <thead>
            <tr role="row">
            <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
            <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
            <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
            <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
            <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
            </tr>
            </thead>
            <tbody>
            <!-- rows -->
            <tr>
            <th scope="row">1</th>
            <td>Mark 1</td>
            <td>Otto</td>
            <td>@mdo</td>
            <td>@twitter 3</td>
            </tr>
            <tr>
            <th scope="row">2</th>
            <td>Mark 10</td>
            <td>Otto</td>
            <td>@mdo</td>
            <td>@twitter 3</td>
            </tr>
            <tr>
            <th scope="row">3</th>
            <td>Jacob</td>
            <td>Thornton</td>
            <td>@fat</td>
            <td>@twitter 4</td>
            </tr>
            <tr>
            <th scope="row">4</th>
            <td>Larry</td>
            <td>the Bird</td>
            <td>@twitter</td>
            <td>@twitter 5</td>
            </tr>
            <tr>
            <th scope="row">5</th>
            <td>Mark 5</td>
            <td>Otto 5</td>
            <td>@mdo 5</td>
            <td>@twitter 5</td>
            </tr>
            <tr>
            <th scope="row">6</th>
            <td>Mark 6</td>
            <td>Otto 6</td>
            <td>@mdo 6</td>
            <td>@twitter 6</td>
            </tr>
            <tr>
            <th scope="row">7</th>
            <td>Mark 7</td>
            <td>Otto 7</td>
            <td>@mdo 7</td>
            <td>@twitter 7</td>
            </tr>
            <tr>
            <th scope="row">8</th>
            <td>Mark 8</td>
            <td>Otto 8</td>
            <td>skb 8</td>
            <td>@twitter 8</td>
            </tr>
            <tr>
            <th scope="row">9</th>
            <td>Mark 9</td>
            <td>Otto 9</td>
            <td>@mdo 9</td>
            <td>@twitter 9</td>
            </tr>
            <tr>
            <th scope="row">10</th>
            <td>Mark 10</td>
            <td>Otto 10</td>
            <td>@mdo 10</td>
            <td>@twitter 10</td>
            </tr>
            <tr>
            <th scope="row">11</th>
            <td>Mark 11</td>
            <td>Otto 11</td>
            <td>@mdo 11</td>
            <td>@twitter 11</td>
            </tr>
            <tr>
            <th scope="row">12</th>
            <td>Mark 9</td>
            <td>Otto 12</td>
            <td>@mdo 12</td>
            <td>@twitter 12</td>
            </tr>

            </tbody>
            </table>
            </div>
            </div>
            </div>
            </div>








            share|improve this answer























              Your Answer






              StackExchange.ifUsing("editor", function () {
              StackExchange.using("externalEditor", function () {
              StackExchange.using("snippets", function () {
              StackExchange.snippets.init();
              });
              });
              }, "code-snippets");

              StackExchange.ready(function() {
              var channelOptions = {
              tags: "".split(" "),
              id: "1"
              };
              initTagRenderer("".split(" "), "".split(" "), channelOptions);

              StackExchange.using("externalEditor", function() {
              // Have to fire editor after snippets, if snippets enabled
              if (StackExchange.settings.snippets.snippetsEnabled) {
              StackExchange.using("snippets", function() {
              createEditor();
              });
              }
              else {
              createEditor();
              }
              });

              function createEditor() {
              StackExchange.prepareEditor({
              heartbeatType: 'answer',
              convertImagesToLinks: true,
              noModals: true,
              showLowRepImageUploadWarning: true,
              reputationToPostImages: 10,
              bindNavPrevention: true,
              postfix: "",
              imageUploader: {
              brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
              contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
              allowUrls: true
              },
              onDemand: true,
              discardSelector: ".discard-answer"
              ,immediatelyShowMarkdownHelp:true
              });


              }
              });














               

              draft saved


              draft discarded


















              StackExchange.ready(
              function () {
              StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53204126%2fadminlte-datatables-not-applying-style-to-label%23new-answer', 'question_page');
              }
              );

              Post as a guest
































              2 Answers
              2






              active

              oldest

              votes








              2 Answers
              2






              active

              oldest

              votes









              active

              oldest

              votes






              active

              oldest

              votes








              up vote
              0
              down vote













              You need to put something like the following in your HTML... (immediately after the dataTables_wrapper DIV)



              <div class="row">
              <div class="col-sm-6">
              <div class="dataTables_length" id="example1_length">
              <label>Show
              <select name="example1_length" class="form-control input-sm" aria-controls="example1">
              <option value="10">10</option>
              <option value="25">25</option>
              <option value="50">50</option>
              <option value="100">100</option>
              </select> entries</label>
              </div>
              </div>
              <div class="col-sm-6">
              <div class="dataTables_filter" id="example1_filter">
              <label>Search:<input class="form-control input-sm" aria-controls="example1" type="search" placeholder=""></label>
              </div>
              </div>
              </div>


              Hope this help?






              share|improve this answer

























                up vote
                0
                down vote













                You need to put something like the following in your HTML... (immediately after the dataTables_wrapper DIV)



                <div class="row">
                <div class="col-sm-6">
                <div class="dataTables_length" id="example1_length">
                <label>Show
                <select name="example1_length" class="form-control input-sm" aria-controls="example1">
                <option value="10">10</option>
                <option value="25">25</option>
                <option value="50">50</option>
                <option value="100">100</option>
                </select> entries</label>
                </div>
                </div>
                <div class="col-sm-6">
                <div class="dataTables_filter" id="example1_filter">
                <label>Search:<input class="form-control input-sm" aria-controls="example1" type="search" placeholder=""></label>
                </div>
                </div>
                </div>


                Hope this help?






                share|improve this answer























                  up vote
                  0
                  down vote










                  up vote
                  0
                  down vote









                  You need to put something like the following in your HTML... (immediately after the dataTables_wrapper DIV)



                  <div class="row">
                  <div class="col-sm-6">
                  <div class="dataTables_length" id="example1_length">
                  <label>Show
                  <select name="example1_length" class="form-control input-sm" aria-controls="example1">
                  <option value="10">10</option>
                  <option value="25">25</option>
                  <option value="50">50</option>
                  <option value="100">100</option>
                  </select> entries</label>
                  </div>
                  </div>
                  <div class="col-sm-6">
                  <div class="dataTables_filter" id="example1_filter">
                  <label>Search:<input class="form-control input-sm" aria-controls="example1" type="search" placeholder=""></label>
                  </div>
                  </div>
                  </div>


                  Hope this help?






                  share|improve this answer












                  You need to put something like the following in your HTML... (immediately after the dataTables_wrapper DIV)



                  <div class="row">
                  <div class="col-sm-6">
                  <div class="dataTables_length" id="example1_length">
                  <label>Show
                  <select name="example1_length" class="form-control input-sm" aria-controls="example1">
                  <option value="10">10</option>
                  <option value="25">25</option>
                  <option value="50">50</option>
                  <option value="100">100</option>
                  </select> entries</label>
                  </div>
                  </div>
                  <div class="col-sm-6">
                  <div class="dataTables_filter" id="example1_filter">
                  <label>Search:<input class="form-control input-sm" aria-controls="example1" type="search" placeholder=""></label>
                  </div>
                  </div>
                  </div>


                  Hope this help?







                  share|improve this answer












                  share|improve this answer



                  share|improve this answer










                  answered 4 hours ago









                  u2tope

                  266




                  266
























                      up vote
                      0
                      down vote













                      use bootstrap.min.css in style. look for code snippet.






                      var tblCardHistory;
                      tblCardHistory = $("#cardhistorynew-table").DataTable({
                      "deferRender": true,
                      "paging": true,
                      "lengthChange": true,
                      "searching": true,
                      "ordering": true,
                      "info": true,
                      "autoWidth": true,
                      columns: [
                      { data: "emp_id" },
                      { data: "name" },
                      { data: "card_no" },
                      { data: "change_time" },
                      { data: "change_date" }
                      ]
                      });

                      <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>

                      <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">


                      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
                      <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
                      <div class="box-body">
                      <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
                      <div class="row">
                      <div class="col-sm-12">
                      <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
                      <thead>
                      <tr role="row">
                      <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
                      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
                      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
                      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
                      <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
                      </tr>
                      </thead>
                      <tbody>
                      <!-- rows -->
                      <tr>
                      <th scope="row">1</th>
                      <td>Mark 1</td>
                      <td>Otto</td>
                      <td>@mdo</td>
                      <td>@twitter 3</td>
                      </tr>
                      <tr>
                      <th scope="row">2</th>
                      <td>Mark 10</td>
                      <td>Otto</td>
                      <td>@mdo</td>
                      <td>@twitter 3</td>
                      </tr>
                      <tr>
                      <th scope="row">3</th>
                      <td>Jacob</td>
                      <td>Thornton</td>
                      <td>@fat</td>
                      <td>@twitter 4</td>
                      </tr>
                      <tr>
                      <th scope="row">4</th>
                      <td>Larry</td>
                      <td>the Bird</td>
                      <td>@twitter</td>
                      <td>@twitter 5</td>
                      </tr>
                      <tr>
                      <th scope="row">5</th>
                      <td>Mark 5</td>
                      <td>Otto 5</td>
                      <td>@mdo 5</td>
                      <td>@twitter 5</td>
                      </tr>
                      <tr>
                      <th scope="row">6</th>
                      <td>Mark 6</td>
                      <td>Otto 6</td>
                      <td>@mdo 6</td>
                      <td>@twitter 6</td>
                      </tr>
                      <tr>
                      <th scope="row">7</th>
                      <td>Mark 7</td>
                      <td>Otto 7</td>
                      <td>@mdo 7</td>
                      <td>@twitter 7</td>
                      </tr>
                      <tr>
                      <th scope="row">8</th>
                      <td>Mark 8</td>
                      <td>Otto 8</td>
                      <td>skb 8</td>
                      <td>@twitter 8</td>
                      </tr>
                      <tr>
                      <th scope="row">9</th>
                      <td>Mark 9</td>
                      <td>Otto 9</td>
                      <td>@mdo 9</td>
                      <td>@twitter 9</td>
                      </tr>
                      <tr>
                      <th scope="row">10</th>
                      <td>Mark 10</td>
                      <td>Otto 10</td>
                      <td>@mdo 10</td>
                      <td>@twitter 10</td>
                      </tr>
                      <tr>
                      <th scope="row">11</th>
                      <td>Mark 11</td>
                      <td>Otto 11</td>
                      <td>@mdo 11</td>
                      <td>@twitter 11</td>
                      </tr>
                      <tr>
                      <th scope="row">12</th>
                      <td>Mark 9</td>
                      <td>Otto 12</td>
                      <td>@mdo 12</td>
                      <td>@twitter 12</td>
                      </tr>

                      </tbody>
                      </table>
                      </div>
                      </div>
                      </div>
                      </div>








                      share|improve this answer



























                        up vote
                        0
                        down vote













                        use bootstrap.min.css in style. look for code snippet.






                        var tblCardHistory;
                        tblCardHistory = $("#cardhistorynew-table").DataTable({
                        "deferRender": true,
                        "paging": true,
                        "lengthChange": true,
                        "searching": true,
                        "ordering": true,
                        "info": true,
                        "autoWidth": true,
                        columns: [
                        { data: "emp_id" },
                        { data: "name" },
                        { data: "card_no" },
                        { data: "change_time" },
                        { data: "change_date" }
                        ]
                        });

                        <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>

                        <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">


                        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
                        <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
                        <div class="box-body">
                        <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
                        <div class="row">
                        <div class="col-sm-12">
                        <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
                        <thead>
                        <tr role="row">
                        <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
                        <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
                        <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
                        <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
                        <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
                        </tr>
                        </thead>
                        <tbody>
                        <!-- rows -->
                        <tr>
                        <th scope="row">1</th>
                        <td>Mark 1</td>
                        <td>Otto</td>
                        <td>@mdo</td>
                        <td>@twitter 3</td>
                        </tr>
                        <tr>
                        <th scope="row">2</th>
                        <td>Mark 10</td>
                        <td>Otto</td>
                        <td>@mdo</td>
                        <td>@twitter 3</td>
                        </tr>
                        <tr>
                        <th scope="row">3</th>
                        <td>Jacob</td>
                        <td>Thornton</td>
                        <td>@fat</td>
                        <td>@twitter 4</td>
                        </tr>
                        <tr>
                        <th scope="row">4</th>
                        <td>Larry</td>
                        <td>the Bird</td>
                        <td>@twitter</td>
                        <td>@twitter 5</td>
                        </tr>
                        <tr>
                        <th scope="row">5</th>
                        <td>Mark 5</td>
                        <td>Otto 5</td>
                        <td>@mdo 5</td>
                        <td>@twitter 5</td>
                        </tr>
                        <tr>
                        <th scope="row">6</th>
                        <td>Mark 6</td>
                        <td>Otto 6</td>
                        <td>@mdo 6</td>
                        <td>@twitter 6</td>
                        </tr>
                        <tr>
                        <th scope="row">7</th>
                        <td>Mark 7</td>
                        <td>Otto 7</td>
                        <td>@mdo 7</td>
                        <td>@twitter 7</td>
                        </tr>
                        <tr>
                        <th scope="row">8</th>
                        <td>Mark 8</td>
                        <td>Otto 8</td>
                        <td>skb 8</td>
                        <td>@twitter 8</td>
                        </tr>
                        <tr>
                        <th scope="row">9</th>
                        <td>Mark 9</td>
                        <td>Otto 9</td>
                        <td>@mdo 9</td>
                        <td>@twitter 9</td>
                        </tr>
                        <tr>
                        <th scope="row">10</th>
                        <td>Mark 10</td>
                        <td>Otto 10</td>
                        <td>@mdo 10</td>
                        <td>@twitter 10</td>
                        </tr>
                        <tr>
                        <th scope="row">11</th>
                        <td>Mark 11</td>
                        <td>Otto 11</td>
                        <td>@mdo 11</td>
                        <td>@twitter 11</td>
                        </tr>
                        <tr>
                        <th scope="row">12</th>
                        <td>Mark 9</td>
                        <td>Otto 12</td>
                        <td>@mdo 12</td>
                        <td>@twitter 12</td>
                        </tr>

                        </tbody>
                        </table>
                        </div>
                        </div>
                        </div>
                        </div>








                        share|improve this answer

























                          up vote
                          0
                          down vote










                          up vote
                          0
                          down vote









                          use bootstrap.min.css in style. look for code snippet.






                          var tblCardHistory;
                          tblCardHistory = $("#cardhistorynew-table").DataTable({
                          "deferRender": true,
                          "paging": true,
                          "lengthChange": true,
                          "searching": true,
                          "ordering": true,
                          "info": true,
                          "autoWidth": true,
                          columns: [
                          { data: "emp_id" },
                          { data: "name" },
                          { data: "card_no" },
                          { data: "change_time" },
                          { data: "change_date" }
                          ]
                          });

                          <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>

                          <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">


                          <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
                          <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
                          <div class="box-body">
                          <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
                          <div class="row">
                          <div class="col-sm-12">
                          <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
                          <thead>
                          <tr role="row">
                          <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
                          </tr>
                          </thead>
                          <tbody>
                          <!-- rows -->
                          <tr>
                          <th scope="row">1</th>
                          <td>Mark 1</td>
                          <td>Otto</td>
                          <td>@mdo</td>
                          <td>@twitter 3</td>
                          </tr>
                          <tr>
                          <th scope="row">2</th>
                          <td>Mark 10</td>
                          <td>Otto</td>
                          <td>@mdo</td>
                          <td>@twitter 3</td>
                          </tr>
                          <tr>
                          <th scope="row">3</th>
                          <td>Jacob</td>
                          <td>Thornton</td>
                          <td>@fat</td>
                          <td>@twitter 4</td>
                          </tr>
                          <tr>
                          <th scope="row">4</th>
                          <td>Larry</td>
                          <td>the Bird</td>
                          <td>@twitter</td>
                          <td>@twitter 5</td>
                          </tr>
                          <tr>
                          <th scope="row">5</th>
                          <td>Mark 5</td>
                          <td>Otto 5</td>
                          <td>@mdo 5</td>
                          <td>@twitter 5</td>
                          </tr>
                          <tr>
                          <th scope="row">6</th>
                          <td>Mark 6</td>
                          <td>Otto 6</td>
                          <td>@mdo 6</td>
                          <td>@twitter 6</td>
                          </tr>
                          <tr>
                          <th scope="row">7</th>
                          <td>Mark 7</td>
                          <td>Otto 7</td>
                          <td>@mdo 7</td>
                          <td>@twitter 7</td>
                          </tr>
                          <tr>
                          <th scope="row">8</th>
                          <td>Mark 8</td>
                          <td>Otto 8</td>
                          <td>skb 8</td>
                          <td>@twitter 8</td>
                          </tr>
                          <tr>
                          <th scope="row">9</th>
                          <td>Mark 9</td>
                          <td>Otto 9</td>
                          <td>@mdo 9</td>
                          <td>@twitter 9</td>
                          </tr>
                          <tr>
                          <th scope="row">10</th>
                          <td>Mark 10</td>
                          <td>Otto 10</td>
                          <td>@mdo 10</td>
                          <td>@twitter 10</td>
                          </tr>
                          <tr>
                          <th scope="row">11</th>
                          <td>Mark 11</td>
                          <td>Otto 11</td>
                          <td>@mdo 11</td>
                          <td>@twitter 11</td>
                          </tr>
                          <tr>
                          <th scope="row">12</th>
                          <td>Mark 9</td>
                          <td>Otto 12</td>
                          <td>@mdo 12</td>
                          <td>@twitter 12</td>
                          </tr>

                          </tbody>
                          </table>
                          </div>
                          </div>
                          </div>
                          </div>








                          share|improve this answer














                          use bootstrap.min.css in style. look for code snippet.






                          var tblCardHistory;
                          tblCardHistory = $("#cardhistorynew-table").DataTable({
                          "deferRender": true,
                          "paging": true,
                          "lengthChange": true,
                          "searching": true,
                          "ordering": true,
                          "info": true,
                          "autoWidth": true,
                          columns: [
                          { data: "emp_id" },
                          { data: "name" },
                          { data: "card_no" },
                          { data: "change_time" },
                          { data: "change_date" }
                          ]
                          });

                          <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>

                          <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">


                          <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
                          <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
                          <div class="box-body">
                          <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
                          <div class="row">
                          <div class="col-sm-12">
                          <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
                          <thead>
                          <tr role="row">
                          <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
                          </tr>
                          </thead>
                          <tbody>
                          <!-- rows -->
                          <tr>
                          <th scope="row">1</th>
                          <td>Mark 1</td>
                          <td>Otto</td>
                          <td>@mdo</td>
                          <td>@twitter 3</td>
                          </tr>
                          <tr>
                          <th scope="row">2</th>
                          <td>Mark 10</td>
                          <td>Otto</td>
                          <td>@mdo</td>
                          <td>@twitter 3</td>
                          </tr>
                          <tr>
                          <th scope="row">3</th>
                          <td>Jacob</td>
                          <td>Thornton</td>
                          <td>@fat</td>
                          <td>@twitter 4</td>
                          </tr>
                          <tr>
                          <th scope="row">4</th>
                          <td>Larry</td>
                          <td>the Bird</td>
                          <td>@twitter</td>
                          <td>@twitter 5</td>
                          </tr>
                          <tr>
                          <th scope="row">5</th>
                          <td>Mark 5</td>
                          <td>Otto 5</td>
                          <td>@mdo 5</td>
                          <td>@twitter 5</td>
                          </tr>
                          <tr>
                          <th scope="row">6</th>
                          <td>Mark 6</td>
                          <td>Otto 6</td>
                          <td>@mdo 6</td>
                          <td>@twitter 6</td>
                          </tr>
                          <tr>
                          <th scope="row">7</th>
                          <td>Mark 7</td>
                          <td>Otto 7</td>
                          <td>@mdo 7</td>
                          <td>@twitter 7</td>
                          </tr>
                          <tr>
                          <th scope="row">8</th>
                          <td>Mark 8</td>
                          <td>Otto 8</td>
                          <td>skb 8</td>
                          <td>@twitter 8</td>
                          </tr>
                          <tr>
                          <th scope="row">9</th>
                          <td>Mark 9</td>
                          <td>Otto 9</td>
                          <td>@mdo 9</td>
                          <td>@twitter 9</td>
                          </tr>
                          <tr>
                          <th scope="row">10</th>
                          <td>Mark 10</td>
                          <td>Otto 10</td>
                          <td>@mdo 10</td>
                          <td>@twitter 10</td>
                          </tr>
                          <tr>
                          <th scope="row">11</th>
                          <td>Mark 11</td>
                          <td>Otto 11</td>
                          <td>@mdo 11</td>
                          <td>@twitter 11</td>
                          </tr>
                          <tr>
                          <th scope="row">12</th>
                          <td>Mark 9</td>
                          <td>Otto 12</td>
                          <td>@mdo 12</td>
                          <td>@twitter 12</td>
                          </tr>

                          </tbody>
                          </table>
                          </div>
                          </div>
                          </div>
                          </div>








                          var tblCardHistory;
                          tblCardHistory = $("#cardhistorynew-table").DataTable({
                          "deferRender": true,
                          "paging": true,
                          "lengthChange": true,
                          "searching": true,
                          "ordering": true,
                          "info": true,
                          "autoWidth": true,
                          columns: [
                          { data: "emp_id" },
                          { data: "name" },
                          { data: "card_no" },
                          { data: "change_time" },
                          { data: "change_date" }
                          ]
                          });

                          <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>

                          <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">


                          <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
                          <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
                          <div class="box-body">
                          <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
                          <div class="row">
                          <div class="col-sm-12">
                          <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
                          <thead>
                          <tr role="row">
                          <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
                          </tr>
                          </thead>
                          <tbody>
                          <!-- rows -->
                          <tr>
                          <th scope="row">1</th>
                          <td>Mark 1</td>
                          <td>Otto</td>
                          <td>@mdo</td>
                          <td>@twitter 3</td>
                          </tr>
                          <tr>
                          <th scope="row">2</th>
                          <td>Mark 10</td>
                          <td>Otto</td>
                          <td>@mdo</td>
                          <td>@twitter 3</td>
                          </tr>
                          <tr>
                          <th scope="row">3</th>
                          <td>Jacob</td>
                          <td>Thornton</td>
                          <td>@fat</td>
                          <td>@twitter 4</td>
                          </tr>
                          <tr>
                          <th scope="row">4</th>
                          <td>Larry</td>
                          <td>the Bird</td>
                          <td>@twitter</td>
                          <td>@twitter 5</td>
                          </tr>
                          <tr>
                          <th scope="row">5</th>
                          <td>Mark 5</td>
                          <td>Otto 5</td>
                          <td>@mdo 5</td>
                          <td>@twitter 5</td>
                          </tr>
                          <tr>
                          <th scope="row">6</th>
                          <td>Mark 6</td>
                          <td>Otto 6</td>
                          <td>@mdo 6</td>
                          <td>@twitter 6</td>
                          </tr>
                          <tr>
                          <th scope="row">7</th>
                          <td>Mark 7</td>
                          <td>Otto 7</td>
                          <td>@mdo 7</td>
                          <td>@twitter 7</td>
                          </tr>
                          <tr>
                          <th scope="row">8</th>
                          <td>Mark 8</td>
                          <td>Otto 8</td>
                          <td>skb 8</td>
                          <td>@twitter 8</td>
                          </tr>
                          <tr>
                          <th scope="row">9</th>
                          <td>Mark 9</td>
                          <td>Otto 9</td>
                          <td>@mdo 9</td>
                          <td>@twitter 9</td>
                          </tr>
                          <tr>
                          <th scope="row">10</th>
                          <td>Mark 10</td>
                          <td>Otto 10</td>
                          <td>@mdo 10</td>
                          <td>@twitter 10</td>
                          </tr>
                          <tr>
                          <th scope="row">11</th>
                          <td>Mark 11</td>
                          <td>Otto 11</td>
                          <td>@mdo 11</td>
                          <td>@twitter 11</td>
                          </tr>
                          <tr>
                          <th scope="row">12</th>
                          <td>Mark 9</td>
                          <td>Otto 12</td>
                          <td>@mdo 12</td>
                          <td>@twitter 12</td>
                          </tr>

                          </tbody>
                          </table>
                          </div>
                          </div>
                          </div>
                          </div>





                          var tblCardHistory;
                          tblCardHistory = $("#cardhistorynew-table").DataTable({
                          "deferRender": true,
                          "paging": true,
                          "lengthChange": true,
                          "searching": true,
                          "ordering": true,
                          "info": true,
                          "autoWidth": true,
                          columns: [
                          { data: "emp_id" },
                          { data: "name" },
                          { data: "card_no" },
                          { data: "change_time" },
                          { data: "change_date" }
                          ]
                          });

                          <link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>

                          <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">


                          <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
                          <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
                          <div class="box-body">
                          <div id="cardhistorynew-table_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
                          <div class="row">
                          <div class="col-sm-12">
                          <table id="cardhistorynew-table" class="table table-bordered table-striped table-hover data-table" role="grid" aria-describedby="cardhistorynew-table_info">
                          <thead>
                          <tr role="row">
                          <th class="sorting_asc" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Employee Id</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Name</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Card Number</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Time</th>
                          <th class="sorting" tabindex="0" aria-controls="cardhistorynew-table" rowspan="1" colspan="1">Creation Date</th>
                          </tr>
                          </thead>
                          <tbody>
                          <!-- rows -->
                          <tr>
                          <th scope="row">1</th>
                          <td>Mark 1</td>
                          <td>Otto</td>
                          <td>@mdo</td>
                          <td>@twitter 3</td>
                          </tr>
                          <tr>
                          <th scope="row">2</th>
                          <td>Mark 10</td>
                          <td>Otto</td>
                          <td>@mdo</td>
                          <td>@twitter 3</td>
                          </tr>
                          <tr>
                          <th scope="row">3</th>
                          <td>Jacob</td>
                          <td>Thornton</td>
                          <td>@fat</td>
                          <td>@twitter 4</td>
                          </tr>
                          <tr>
                          <th scope="row">4</th>
                          <td>Larry</td>
                          <td>the Bird</td>
                          <td>@twitter</td>
                          <td>@twitter 5</td>
                          </tr>
                          <tr>
                          <th scope="row">5</th>
                          <td>Mark 5</td>
                          <td>Otto 5</td>
                          <td>@mdo 5</td>
                          <td>@twitter 5</td>
                          </tr>
                          <tr>
                          <th scope="row">6</th>
                          <td>Mark 6</td>
                          <td>Otto 6</td>
                          <td>@mdo 6</td>
                          <td>@twitter 6</td>
                          </tr>
                          <tr>
                          <th scope="row">7</th>
                          <td>Mark 7</td>
                          <td>Otto 7</td>
                          <td>@mdo 7</td>
                          <td>@twitter 7</td>
                          </tr>
                          <tr>
                          <th scope="row">8</th>
                          <td>Mark 8</td>
                          <td>Otto 8</td>
                          <td>skb 8</td>
                          <td>@twitter 8</td>
                          </tr>
                          <tr>
                          <th scope="row">9</th>
                          <td>Mark 9</td>
                          <td>Otto 9</td>
                          <td>@mdo 9</td>
                          <td>@twitter 9</td>
                          </tr>
                          <tr>
                          <th scope="row">10</th>
                          <td>Mark 10</td>
                          <td>Otto 10</td>
                          <td>@mdo 10</td>
                          <td>@twitter 10</td>
                          </tr>
                          <tr>
                          <th scope="row">11</th>
                          <td>Mark 11</td>
                          <td>Otto 11</td>
                          <td>@mdo 11</td>
                          <td>@twitter 11</td>
                          </tr>
                          <tr>
                          <th scope="row">12</th>
                          <td>Mark 9</td>
                          <td>Otto 12</td>
                          <td>@mdo 12</td>
                          <td>@twitter 12</td>
                          </tr>

                          </tbody>
                          </table>
                          </div>
                          </div>
                          </div>
                          </div>






                          share|improve this answer














                          share|improve this answer



                          share|improve this answer








                          edited 4 hours ago

























                          answered 4 hours ago









                          Shiv Kumar Baghel

                          9821617




                          9821617






























                               

                              draft saved


                              draft discarded



















































                               


                              draft saved


                              draft discarded














                              StackExchange.ready(
                              function () {
                              StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53204126%2fadminlte-datatables-not-applying-style-to-label%23new-answer', 'question_page');
                              }
                              );

                              Post as a guest




















































































                              Popular posts from this blog

                              鏡平學校

                              ꓛꓣだゔៀៅຸ໢ທຮ໕໒ ,ໂ'໥໓າ໼ឨឲ៵៭ៈゎゔit''䖳𥁄卿' ☨₤₨こゎもょの;ꜹꟚꞖꞵꟅꞛေၦေɯ,ɨɡ𛃵𛁹ޝ޳ޠ޾,ޤޒޯ޾𫝒𫠁သ𛅤チョ'サノބޘދ𛁐ᶿᶇᶀᶋᶠ㨑㽹⻮ꧬ꧹؍۩وَؠ㇕㇃㇪ ㇦㇋㇋ṜẰᵡᴠ 軌ᵕ搜۳ٰޗޮ޷ސޯ𫖾𫅀ल, ꙭ꙰ꚅꙁꚊꞻꝔ꟠Ꝭㄤﺟޱސꧨꧼ꧴ꧯꧽ꧲ꧯ'⽹⽭⾁⿞⼳⽋២៩ញណើꩯꩤ꩸ꩮᶻᶺᶧᶂ𫳲𫪭𬸄𫵰𬖩𬫣𬊉ၲ𛅬㕦䬺𫝌𫝼,,𫟖𫞽ហៅ஫㆔ాఆఅꙒꚞꙍ,Ꙟ꙱エ ,ポテ,フࢰࢯ𫟠𫞶 𫝤𫟠ﺕﹱﻜﻣ𪵕𪭸𪻆𪾩𫔷ġ,ŧآꞪ꟥,ꞔꝻ♚☹⛵𛀌ꬷꭞȄƁƪƬșƦǙǗdžƝǯǧⱦⱰꓕꓢႋ神 ဴ၀க௭எ௫ឫោ ' េㇷㇴㇼ神ㇸㇲㇽㇴㇼㇻㇸ'ㇸㇿㇸㇹㇰㆣꓚꓤ₡₧ ㄨㄟ㄂ㄖㄎ໗ツڒذ₶।ऩछएोञयूटक़कयँृी,冬'𛅢𛅥ㇱㇵㇶ𥄥𦒽𠣧𠊓𧢖𥞘𩔋цѰㄠſtʯʭɿʆʗʍʩɷɛ,əʏダヵㄐㄘR{gỚṖḺờṠṫảḙḭᴮᵏᴘᵀᵷᵕᴜᴏᵾq﮲ﲿﴽﭙ軌ﰬﶚﶧ﫲Ҝжюїкӈㇴffצּ﬘﭅﬈軌'ffistfflſtffतभफɳɰʊɲʎ𛁱𛁖𛁮𛀉 𛂯𛀞నఋŀŲ 𫟲𫠖𫞺ຆຆ ໹້໕໗ๆทԊꧢꧠ꧰ꓱ⿝⼑ŎḬẃẖỐẅ ,ờỰỈỗﮊDžȩꭏꭎꬻ꭮ꬿꭖꭥꭅ㇭神 ⾈ꓵꓑ⺄㄄ㄪㄙㄅㄇstA۵䞽ॶ𫞑𫝄㇉㇇゜軌𩜛𩳠Jﻺ‚Üမ႕ႌႊၐၸဓၞၞၡ៸wyvtᶎᶪᶹစဎ꣡꣰꣢꣤ٗ؋لㇳㇾㇻㇱ㆐㆔,,㆟Ⱶヤマފ޼ޝަݿݞݠݷݐ',ݘ,ݪݙݵ𬝉𬜁𫝨𫞘くせぉて¼óû×ó£…𛅑הㄙくԗԀ5606神45,神796'𪤻𫞧ꓐ㄁ㄘɥɺꓵꓲ3''7034׉ⱦⱠˆ“𫝋ȍ,ꩲ軌꩷ꩶꩧꩫఞ۔فڱێظペサ神ナᴦᵑ47 9238їﻂ䐊䔉㠸﬎ffiﬣ,לּᴷᴦᵛᵽ,ᴨᵤ ᵸᵥᴗᵈꚏꚉꚟ⻆rtǟƴ𬎎

                              Why https connections are so slow when debugging (stepping over) in Java?