jquery Datatable

Question

我是jQuery中的新成員。我在網格中使用了數據表。

我已經打了其中的jQuery數據表是顯示在底部的信息欄的問題： enter image description here

我想顯示第一項和頁下拉列表， 這裏是我的代碼：

HTML：

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

<script type="text/javascript" src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script> 

<table class="table table-condensed tableDesign tablePagination"> 
          <thead> 
          <tr > 
           <th>File Name</th> 
           <th>TimeStamp</th> 
           <th>Total NON DND MSISDN COUNT</th> 
           <th>Total DND MSISDN COUNT</th> 
           <th>Status</th> 
          </tr> 
          </thead> 
          <tbody> 
          <tr> 
           <td>test1.csv</td> 
           <td>11/10/17 11:22:45</td> 
           <td>3 
            <a class="downloadCampaign" href=""> 
             <u>Download </u> 
            </a> 
           </td> 
           <td>2 <a class="downloadCampaign" href=""> 
            <u>Download </u> 
           </a></td> 
           <td>Completed</td> 
          </tr> 
          <tr> 
           <td>abc.csv</td> 
           <td>12/10/17 11:22:45</td> 
           <td>3 <a class="downloadCampaign" href=""> 
            <u>Download </u> 
           </a></td> 
           <td>2 <a class="downloadCampaign" href=""> 
            <u>Download </u> 
           </a></td> 
           <td>Completed</td> 
          </tr> 
          <tr> 
           <td>xyz1.csv</td> 
           <td>13/10/17 11:22:45</td> 
           <td>3 <a class="downloadCampaign" href=""> 
            <u>Download </u> 
           </a> </td> 
           <td>2 <a class="downloadCampaign" href=""> 
            <u>Download </u> 
           </a></td> 
           <td>Completed</td> 
          </tr> 
          <tr> 
           <td>test2.csv</td> 
           <td>11/1/17 11:22:45</td> 
           <td>3 <a class="downloadCampaign" href=""> 
            <u>Download </u> 
           </a></td> 
           <td>2 <a class="downloadCampaign" href=""> 
            <u>Download </u> 
           </a></td> 
           <td>Completed</td> 
          </tr> 

          </tbody> 
         </table> 

JS：

$(document).ready(function(){ 
    var table = $('.tablePagination').DataTable({ 
     /* "sDom": '<"top"i>rt<"bottom"flp><"clear">',*/ 
     "bSort": false, 
     "sDom": 'Rfrtlip', 
     "oLanguage": { 
      "sLengthMenu": "_MENU_", 
      "sInfo": "View _START_ - _END_ of _TOTAL_", 
      "sInfoEmpty": "No Entries" 
     } 

    }); 
}); 

CSS：

.dataTables_filter, .dataTables_paginate { 
    display: none; 
} 
.dataTables_length { 
    float: right !important; 
    padding-top: 0px; 
} 

輸出： enter image description here

它不是由那邊傳來的一面。

Answer 1

你好，你可以在那裏使用的是dataTables_length類下面寫CSS代碼的數據表

.dataTables_filter, .dataTables_paginate { 
    display: none; 
} 
.dataTables_length { 
    position: absolute; 
    right: 100px; 
    padding: 10px; 
} 
.dataTables_info{ 
    position: absolute; 
    right: 0px; 
    width:100px; 
} 

To see demo jsFiddle Link