Buenos días foro,
tengo una tabla de Ingresos Html dinámica (se añaden filas nuevas mediante javascript) con la siguiente estructura de columnas:
Categoria (select)
Mensualidad (select)
concepto (input, al empezar a escribir deben aparecer los resultados en un desplegable)
unidades (input)
importe (input)
descuento (input)
Antes de la tabla tengo un buscador en ajax que funciona correctamente, al empezar a escribir en el input del buscador sale un desplegable con las busquedas encontradas, en el momento que hago click en uno de los resultados se carga la info en la primera linea de la tabla y se carga una nueva fila dinamicamente..
El problema viene cuando vuelvo a buscar y selecciono otro elemento del desplegable de busqueda, mi intencion seria que el contenido cargara en la segunda fila de la tabla pero en vez de eso carga en la primera fila de la tabla machacando el contenido previamente insertado.
Código HTML:
Ver original <a class="toggle-link" onclick="eliminar_fila_recibos(this)"> <i class="glyphicon glyphicon-minus"></i>
<?php echo $tipos_servicio_select; ?>
<?php echo $mensualidades_select; ?>
<input type="text" id="concepto_ingreso" class="input" value="" style="width: 300px;"/> <!--<input type="text" id="concepto_recibos" class="input buscador_ingresos" value="" style="width: 300px;"/>-->
<!--<div id="resultados_busqueda_servicio" class="resul_busq_servicio">
</div>-->
<input type="text" id="unidades_ingreso" class="input" value="0" style="width: 50px;"/>
<input type="text" name="precio_ingreso" id="precio_ingreso" class="input precio_recibos" value="0" style="width: 50px;"/>
<input type="text" id="descuento_ingreso" class="input" value="0" style="width: 50px;"/>
Para añadir la fila a la tabla dinamicamente:
Código Javascript
:
Ver originalvar select = recoge_select();
var select2 = recoge_select_mensualidades();
$('#tabla_ingresos tr:last').after('<tr id="fila"><td><a class="toggle-link" onclick="eliminar_fila_recibos(this)"><i class="glyphicon glyphicon-minus"></i></a></td><td>'+select+'</td><td>'+select2+'</td><td><input type="text" id="concepto_ingreso" class="input buscador_ingresos" value="" style="width: 300px;"/><div id="resultados_busqueda_servicio" class="resul_busq_servicio"></div></td><td><input type="text" class="input" value="0" style="width: 50px;"/></td><td><input type="text" name="precio_ingreso" id="precio_ingreso" class="input precio_recibos" value="0" style="width: 50px;"/></td><td><input type="text" class="input" value="0" style="width: 50px;"/></td></tr>');
Para sobreescribir la fila de la tabla con lo datos de la seleccion del buscador
Código Javascript
:
Ver originalfunction selecciona_servicio(id_servicio_seleccionado)
{
$.ajax(
{
type: 'POST',
url: '<?php echo base_url().'admin_controllers/ingresos_controllers/insertar_ingresos_controller/'.'seleccionar_servicio';?>',
data: {info: id_servicio_seleccionado},
success: function (data2)
{
// Decodifica el array recibido(codificado en JSON) http://www.dyn-web.com/tutorials/php-js/json/array.php
var valores2 = JSON.parse(data2);
document.getElementById("fila").lastChild.value=valores2.precio_servicio;
var select = recoge_select();
var select2 = recoge_select_mensualidades();
$('#tabla_ingresos tr:last').after('<tr id="fila"><td><a class="toggle-link" onclick="eliminar_fila_recibos(this)"><i class="glyphicon glyphicon-minus"></i></a></td><td>'+select+'</td><td>'+select2+'</td><td><input type="text" id="concepto_ingreso" class="input buscador_ingresos" value="" style="width: 300px;"/><div id="resultados_busqueda_servicio" class="resul_busq_servicio"></div></td><td><input type="text" class="input" value="0" style="width: 50px;"/></td><td><input type="text" name="precio_ingreso" id="precio_ingreso" class="input precio_recibos" value="0" style="width: 50px;"/></td><td><input type="text" class="input" value="0" style="width: 50px;"/></td></tr>');
}
});
}
Que formas habría para solucionar este problema?
Gracias de antemano.