Estos son DataTables https://datatables.net/forums/discussion/23922/assign-an-id-to-the-search-input
Tengo una implementación en el proyecto Vue3, pero no puedo corregir algunos errores. Debería ser simple, pero no puedo obtener ningún elemento generado dinámicamente allí. Por ejemplo, necesita agregar clase a la entrada de búsqueda. De acuerdo con el enlace que mencioné anteriormente, el código que uso parece
setDataTable() { var table = $('#myTable'); if( this.dataTableObject ) return this.dataTableObject.draw(); this.dataTableObject = table.DataTable({ 'responsive': true, "pageLength": 10, ... }); // Both selectors are empty. $('.dataTables_wrapper').find('input'); }Antes del código importo las librerías requeridas
import "datatables.net-bs4/css/dataTables.bootstrap4.css" import 'datatables.net-bs4'Pero el selector está vacío. Espero que alguien sepa porque paso todo el día sin éxito. Gracias.
Mi solución se basa en el evento de sorteo.
this.dataTableObject.on('draw', function(e) { $(this).closest('.dataTables_wrapper') .removeClass('form-inline') .find('.col-xs-12').addClass('col-12'); });El foro de DataTables dice que tengo una versión antigua de DTBootstrap4. Así que tengo curiosidad por lo que responden en la pregunta que les hice. Porque este es un código realmente sucio.
este elemento es fácilmente editable, he agregado 'style="background: green"' para la búsqueda de entrada y funcionó.
Intente establecer propiedad por propiedad usando:
document.getElementById("p2").style.color="blue";O intente cambiar toda la clase usando:
document.getElementById("p2").className = "classname";