En mi área de administración tengo más de 50 módulos que utilizan los voluntarios para mantener las tablas de la base de datos. En cada módulo tengo un formulario para editar registros y una tabla de datos para enumerar todos los registros. Para editar un registro, el usuario encuentra el registro en la tabla de datos y selecciona/hace clic en la fila. El clic activa un evento de clic de tabla cuando luego hace que la información del registro llene el formulario como se ilustra en el siguiente código.
let rowData = oTable.row(this).data(); $('#bio_name').val(rowData.bio_name); $('#bio_title').val(rowData.bio_title); $('#bio_sub_fk').val(rowData.bio_sub_fk); $('#bio_text_top').val(rowData.bio_text_top); $('#bio_text_main').val(rowData.bio_text_main); $('#bio_text_bot').val(rowData.bio_text_bot);Me gustaría actualizar el proceso para poder llamar a una función para completar el formulario en lugar de tener que mantener más de 50 módulos. la llamada seria
load_Form( prefix, rowData );y la funcion seria
function load_Form( prefix, rowData ) { $('[id^=' + prefix + '_]').each( function() { // What goes here? }); }Pero no sé qué iría en .each( function() {. Pensaría algo como
$(this).val(rowData.this);Pero no creo que el segundo 'esto' sea correcto. Cualquier ayuda sería muy apreciada.
TIA James A. Wilson www.txfannin.org
No estoy tan familiarizado con jQuery, pero imagino que la función .each toma argumentos que representan el elemento actual.
Consulte la documentación de .each para ver los argumentos que acepta
Aquí hay una implementación en vanilla js. Tenga en cuenta la parte del element en el .forEach
Luego podemos obtener la identificación del elemento con el que coincidimos y eliminar el prefijo para que la propiedad coincida con nuestra fuente de datos.
const dataSource = { firstName: 'John', lastName: 'Doe', age: 45, }; function populateForm(prefix, data) { [...document.querySelectorAll(`[id^=${prefix}`)].forEach((element, index, array) => { const field = element.getAttribute('id').replace(prefix, ''); element.value= data[field]; }) } populateForm('bio_', dataSource); <input id="bio_firstName"/> <input id="bio_lastName"/> <input id="bio_age"/>