Estoy generando un DataTable con una fuente de datos javascript. Los datos se devuelven desde una llamada ajax a nodejs que consulta la tabla de base de datos de SQL Server y devuelve 2 columnas, ambas con datos numéricos. Estoy agregando 2 columnas más para contener campos de entrada, con un valor predeterminado de 0, para que el usuario ingrese números que aumentarán/disminuirán los valores que se encuentran en ColumnA/B.
$('#mytable').DataTable( { "data": data, "columns": [ { "data": "ColumnA", "defaultContent": "NA" }, { "data": "ColumnB", "defaultContent": "NA" }, { "data": undefined, "defaultContent": '<input type="text" value="0" size="10"/>'}, { "data": undefined, "defaultContent": '<input type="text" value="0" size="10"/>'} ] });Esto funciona bien y puedo modificar el texto en el campo de entrada de la celda. Hay un campo de entrada separado fuera de la tabla en el que el usuario puede hacer clic para "enviar cambios", que llama a una función de JavaScript que leerá esos campos de entrada de la tabla. Sin embargo, no puedo averiguar cómo conseguirlos. Usando:
var aTable = $('#mytable').DataTable(); var colAchange = atable.cell(0, 2).data(); var colBchange = atable.cell(0, 3).data();Ambos colA/Bchange vars solo tienen el texto html 'input type="text" ...', no el valor del campo de entrada. Esto tiene sentido, pero no puedo encontrar la forma correcta de leer el valor del campo de entrada. En un momento había leído en los documentos de Datatables que puede agregar 'metadatos' a los datos de la fila. ¿Necesito hacer eso para obtener una "identificación" en ese elemento y consultar el elemento por eso? De lo contrario, ¿cómo obtengo el valor de esa entrada?
Si solo desea extraer los valores ingresados en los cuadros de entrada, debe pasar por jQuery o DOM nativo. dataTables en sí no tiene conocimiento de ningún cambio realizado en los campos de entrada de formularios, por lo que intentar recuperar los valores mediante cell().data() nunca funcionará, con o sin id 's/datos ortogonales:
aTable.cell(0,2).nodes().to$().find('input').val() aTable.cell(0,3).nodes().to$().find('input').val()Le dará el valor actual de las distintas entradas. Ha replicado su escenario anterior al 100% en este violín -> http://jsfiddle.net/obmghyo7/
Básicamente, así es como la documentación oficial sugiere una forma de extraer valores de las entradas de formulario -> https://datatables.net/examples/api/form.html
Si desea realizar filtrado/búsquedas dentro de la tabla, que también incluye los cambios realizados por el usuario en las entradas del formulario, entonces es un poco más complicado -> JQuery Datatables busca dentro de la entrada y selecciona (la mía, pero no sé ninguna respuesta mejor )
Tengo una especie de solución hackish pero aplicable y simple. Lo que hay que tener en cuenta es que mi código SÍ permite el uso del método DataTables data() y también que esta es más una solución para cualquiera que reciba código HTML en lugar de texto interno de cada celda de una fila, en lugar de tratar de obtener el valor de un cuadro de texto de input . La fila en la que se hizo clic devuelve una matriz a través data() . Cada celda de la fila está envuelta en un span por lo que cualquier cadena de texto simple/no HTML dentro de un td puede representarse como elementos HTML y, por lo tanto, ser reconocida por el método jQuery text() :
$('#mytable tbody').on('click', 'tr', function (e) { var rowArray = aTable.row(this).data(); var colAchange = $('<span/>').html(rowArray[0]).text(); var colBchange = $('<span/>').html(rowArray[1]).text(); });JSFiddle: https://jsfiddle.net/nyv7j6h8/