2017-10-18 9 views
0

は、私は大画面で10列を持つデータテーブルを持っていますが、画面のサイズが変更されたときの優先順位は、最初と最後の列に与えられることを希望:のDataTable応答列優先

<div class="card mb-3"> 
<div class="card-header"> 
    <i class="fa fa-table"></i> Client Database</div> 
<div class="card-body"> 
    <div class="table-responsive"> 
    <table class="table table-bordered" id="dataTable" class="display nowrap" cellspacing="0"> 
    <thead> 
     <tr> 
      <th data-priority="1">Address</th> 
      <th>Location</th> 
      <th>Name</th> 
      <th>Joining Date</th> 
      <th>Phone</th> 
      <th>DB Serial</th> 
      <th>Status</th> 
      <th>Contract Payments</th> 
      <th>Battery Reserve</th> 
      <th data-priority="2">Action</th> 
     </tr> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $('#dataTable').DataTable({ 
     responsive: true, 
    }); 
}); 
</script> 

<script src="vendor/datatables/jquery.dataTables.js"></script> 
<script src="vendor/datatables/dataTables.bootstrap4.js"></script> 
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.10.16/b-1.4.2/r-2.2.0/datatables.min.css"/> 
<script type="text/javascript" src="https://cdn.datatables.net/v/bs4/dt-1.10.16/b-1.4.2/r-2.2.0/datatables.min.js"></script> 

ただし、列がされていますまだない応答: enter image description here

+0

3つの理由:1)なぜクラスセレクタを2回追加するのですか? 2)ローカルの 'jquery.dataTables.js'からインクルードしているのであれば、なぜそれをcdnから再度インクルードしていますか? 3)あなたのスニペットコードが完全ではない、または有効ではないようです。 –

答えて