2013-11-19 7 views
0

Я полностью новичок в JQuery, но мне нужна помощь для этой части. Я занимаюсь динамической таблицей из шаблона. Я хочу удалить 10 записей на странице, но я понятия не имею, как это сделать. Кто-нибудь, пожалуйста?Динамическая таблица Редактирование JQuery

Вот HTML-код, который я до сих пор понятно

<table class="table table-striped border-top" id="sample_1"> 
     <thead> 
      <tr> 
      <!-- <th style="width:8px;"><input type="checkbox" class="group-checkable" data-set="#sample_1 .checkboxes" /></th> --> 
      <th>No</th> 
      <th>Name</th> 
      <th class="hidden-phone">Name</th> 
      <th class="hidden-phone">Text</th> 
      <th class="hidden-phone">Text</th> 
      <th class="hidden-phone">Text</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr class="odd gradeX"> 
      <!-- <td><input type="checkbox" class="checkboxes" value="1" /></td> --> 
      <td>1</td> 
      <td>Jhone doe</td> 
      <td class="hidden-phone"><a href="mailto:[email protected]">[email protected]</a></td> 
      <td class="hidden-phone">10</td> 
      <td class="center hidden-phone">02.03.2013</td> 
      <td class="hidden-phone"><span class="label label-success">Approved</span></td> 
      </tr> 
      <tr class="odd gradeX"> 
      <!-- <td><input type="checkbox" class="checkboxes" value="1" /></td> --> 
      <td>2</td> 
      <td>dipsdf</td> 
      <td class="hidden-phone"><a href="mailto:soa [email protected]">[email protected]</a></td> 
      <td class="hidden-phone">33</td> 
      <td class="center hidden-phone">05.04.2013</td> 
      <td class="hidden-phone"><span class="label label-success">Approved</span></td> 
      </tr> 
     </tbody> 
     </table> 

Jquery часть, которую я понятия не имею, что он делает там

var Script = function() { 

    // begin first table 
    $('#sample_1').dataTable({ 
     "sDom": "<'row'<'col-sm-6'l><'col-sm-6'f>r>t<'row'<'col-sm-6'i><'col-sm-6'p>>", 
     "sPaginationType": "bootstrap", 
     "oLanguage": { 
      "sLengthMenu": "_MENU_ records per page", 
      "oPaginate": { 
       "sPrevious": "Prev", 
       "sNext": "Next" 
      } 
     }, 
     "aoColumnDefs": [{ 
      'bSortable': false, 
      'aTargets': [0] 
     }] 
    }); 

    jQuery('#sample_1 .group-checkable').change(function() { 
     var set = jQuery(this).attr("data-set"); 
     var checked = jQuery(this).is(":checked"); 
     jQuery(set).each(function() { 
      if (checked) { 
       $(this).attr("checked", true); 
      } else { 
       $(this).attr("checked", false); 
      } 
     }); 
     jQuery.uniform.update(set); 
    }); 

    jQuery('#sample_1_wrapper .dataTables_filter input').addClass("form-control"); // modify table search input 
    jQuery('#sample_1_wrapper .dataTables_length select').addClass("form-control"); // modify table per page dropdown}(); 

Я пытаюсь связать таблицу с данными отображения из базы данных при замене 10 записей на страницу страницы кнопкой добавления. Любой, пожалуйста.

Цените.

ответ

1

Если вы просто пытаетесь перечислить все записи за один раз (плюс скрыть возможность изменения номера на странице), вам необходимо отключить разбиение на страницы.

Добавьте к вызову данных следующий параметр.

"bPaginate": false 

Подробнее о DataTable вариантов here.

EDIT

Если вы все еще хотите постраничной, а просто скрыть параметр «на странице», используйте следующий вариант вместо.

"bLengthChange": false 

JSFiddle

+0

Спасибо за информацию. В конце концов, он также удалил нижнюю страницу. = (Любая идея, как удалить верхнюю часть 1, а не удалить оба. –

+0

@CarsonLee Я обновил свой ответ, проверю его и дайте мне знать, если это поможет. –

+0

Perfect Match bro = D Но я хотел бы знать, как добавить кнопку в нее n подходящим образом? Потому что я не могу найти CSS, чтобы положить кнопку в приятное место, например, место bLengthChange. –

Смежные вопросы