jquery - paginacion - quitar ordenamiento datatables

¿Cómo puedo eliminar la barra de búsqueda y el pie de página agregados por el complemento jQuery DataTables?

Question

Estoy usando jQuery DataTables .

Quiero eliminar la barra de búsqueda y el pie de página (que muestra cuántas filas hay visibles) que se agregan a la tabla de forma predeterminada. Solo quiero usar este plugin para ordenar, básicamente. Se puede hacer esto?

Answer 1

Aquí puede agregar elementos sDom a su código, la barra de búsqueda superior está oculta.

$(document).ready(function() {
$(''#example'').dataTable( {
"sDom": ''<"top">rt<"bottom"flp><"clear">''
} );
} );

Answer 2

Creo que la forma más sencilla es:

<th data-searchable="false">Column</th>

Puede editar solo la tabla que tiene que modificar, sin cambiar CSS común o JS.

Answer 3

Esto se puede hacer simplemente cambiando la configuración:

$(''table'').dataTable({
paging: false,
info: false
});

Pero para ocultar el pie de página vacío; Esta pieza de código hace el truco:

 $(''table'').dataTable({
paging: false,
info: false,
//add these config to remove empty header
"bJQueryUI": true,
"sDom": ''lfrtip''
});

Answer 4

Lo he hecho asignando un pie de página a un ID y luego a un estilo usando css:

 <table border="1" class="dataTable" id="dataTable_${dtoItem.key}" >
<thead>
<tr>
<th></th>
</tr>
</thead>
<tfoot>
<tr>
<th id="FooterHidden"></th>
</tr>
</tfoot>
<tbody>
<tr>
<td class="copyableField"></td>
</tr>
</tbody>
</table>

luego estilizando usando css:

#FooterHidden{
display: none;
}

Como se mencionó anteriormente, las formas no están funcionando para mí.

Answer 5

Para DataTables> = 1.10 , use:

$(''table'').dataTable({searching: false, paging: false, info: false});

Para tablas de datos <1.10 , use:

$(''table'').dataTable({bFilter: false, bInfo: false});

o usando CSS puro:

.dataTables_filter, .dataTables_info { display: none; }

Answer 6

Podrías esconderlos vía css:

#example_info, #example_filter{display: none}

Answer 7

Puede utilizar el atributo sDom. El código se ve algo como esto.

$(document).ready(function() {
$(''#example'').dataTable( {
''sDom'': ''"top"i''
} );
} );

Oculta el cuadro de búsqueda y buscapersonas.

Answer 8

Según lo dicho por @Scott Stafford sDOM es la propiedad más apropiada para mostrar, ocultar o reubicar los elementos que componen los DataTables. Creo que el sDOM ahora está desactualizado, con el parche real esta propiedad ahora es dom .

Esta propiedad también permite establecer alguna clase o id en un elemento, para que puedas un estilo más fácil.

Consulte la documentación oficial aquí: datatables.net/reference/option/dom

Este ejemplo solo muestra la tabla:

$(''#myTable'').DataTable({
"dom": ''t''
});

Answer 9

Si está utilizando el controlador de vídeo:

.dataTables_wrapper .fg-toolbar { display: none; }

Answer 10

Si está utilizando un filtro personalizado, es posible que desee ocultar el cuadro de búsqueda pero que aún desee habilitar la función de filtro, por lo que bFilter: false no es la forma. Use dom: ''lrtp'' lugar, el valor predeterminado es ''lfrtip'' . Documentación: datatables.net/reference/option/dom

Answer 11

Tampoco puede dibujar el encabezado o el pie de página configurando sDom : http://datatables.net/usage/options#sDom

''sDom'': ''t''

mostrará SOLO la tabla, sin encabezados ni pies de página ni nada.

Se discute algo aquí: http://www.datatables.net/forums/discussion/2722/how-to-hide-empty-header-and-footer/p1

Answer 12

Una forma rápida y sucia es averiguar la clase del pie de página y ocultarla utilizando jQuery o CSS:

$(".dataTables_info").hide();

Answer 13

Visite http://www.datatables.net/examples/basic_init/filter_only.html para ver una lista de características para mostrar / ocultar.

Lo que desea es configurar "bFilter" y "bInfo" en falso;

$(document).ready(function() {
$(''#example'').dataTable( {
"bPaginate": false,
"bFilter": false,
"bInfo": false
} );
} );

Answer 14

Solo un recordatorio de que no puede inicializar DataTable en el mismo elemento <table> dos veces.

Si encuentra el mismo problema, puede configurar la searching y la paging falsas al inicializar DataTable en su <table> HTML como esto.

 $(''#tbl'').DataTable({
searching: false,
paging: false,
dom: ''Bfrtip'',
buttons: [
''copy'', ''csv'', ''excel'', ''pdf'', ''print''
]
});

Answer 15

<script>
$(document).ready(function() {
$(''#nametable'').DataTable({
"bPaginate": false,
"bFilter": false,
"bInfo": false
});
});
</script>

en su constructor de datos

https://datatables.net/forums/discussion/20006/how-to-remove-cross-icon-in-search-box

Answer 16

hello friends you can add simply searching: false in your js
$(''#companies_grid'').DataTable({
responsive: true,
searching: false,
iDisplayLength: 25,
"ajax": base_url + "companies/company_table",
"columns": [{
"data": "SRNO"
},
{
"data": "CompanyName"
},
{
"data": "Country"
},
{
"data": "CustomDomain"
},
{
"data": "Email"
},
{
"data": "Edit"
}
]
});

Answer 17

var table = $("#datatable").DataTable({
"paging": false,
"ordering": false,
"searching": false
});