Tengo una grilla dinamica que consta de los siguientes campos:
Codigo | Descripcion | Cantidad |Boton "Buscador de articulos"
Lo primero que hace el usuario es agregar una fila nueva, luego presiona el boton del buscador de articulo, selecciona dicho articulo en una ventana que desaparece al ser seleccionado el articulo y se cargan los campos de texto Cod,Desc, y la cantidad lo ingresa el usuario.
Hasta aca todo bien en la primera fila.
Para volver a cargar otro articulo el usuario repite el proceso pero cuando selecciona de nuevo el articulo en el buscador retorna pero en la primera fila que ya se encuentra cargado y lo actualiza en vez de que retorne los datos a la segunda fila.
Ahora mi pregunta: Como hago para que cargue en filas diferentes y no en la misma fila?
Codigo JS
Código HTML:
function agregarfila() { if (tabla.getElementsByTagName("tr").length < 11) { crearElementos(); } else { alert("Solo puede agregar 10 registros"); } } function crearElementos() { var tabla = document.getElementById("tabla"); var fila = tabla.insertRow(1); // celda1.appendChild(t1); //celda2.appendChild(t2); var celda1 = fila.insertCell(0); var element1 = document.createElement("input"); element1.type = "checkbox"; celda1.appendChild(element1); var celda2 = fila.insertCell(1); var element2 = document.createElement("input"); element2.type = "text"; element2.disabled = "true"; celda2.appendChild(element2); var celda3 = fila.insertCell(2); var element3 = document.createElement('a'); var linkText = document.createTextNode("Buscar"); element3.appendChild(linkText); element3.title = "Buscar"; element3.href = "javascript:ventana('../../Movimientos/Pedidos_1/BUSCARITEM.jsp');"; //ventana que retorna los articulos celda3.appendChild(element3); var celda4 = fila.insertCell(3); var element4 = document.createElement("input"); element4.type = "text"; element4.disabled = "true"; celda4.appendChild(element4); var celda5 = fila.insertCell(4); var element5 = document.createElement("input"); element5.type = "text"; celda5.appendChild(element5); } function borrarFila() { try { var tabla = document.getElementById("tabla"); var rowCount = tabla.rows.length; for (var i = 0; i < rowCount; i++) { var row = tabla.rows[i]; var chkbox = row.cells[0].childNodes[0]; if (null !== chkbox && true === chkbox.checked) { tabla.deleteRow(i); rowCount--; i--; } } } catch (e) { alert(e); } }
Codigo HTML
Código HTML:
<table border="1" class="tablafactura" id="tabla" > <thead> <tr> <th width="10%">Borrar</th> <th width="">Codigo</th> <th width="10%">Buscar</th> <th width="60%">Descripcion</th> <th width="10%">Cantidad</th> </tr> </thead> <tbody><!-- Grilla Detalle--> <INPUT type="button" accesskey="a" title="ALT+a" value="Agregar" onclick="agregarfila('tabla');"/> <INPUT type="button" value="Borrar" onclick="borrarFila('tabla');" /> <tr> <TD width="10%"><INPUT type="checkbox" NAME="chk"/></TD> <TD width=""><input name="itm_cod" type="text" id="itm_cod" value="" disabled/> </TD> <TD width="10%"> <a href="javascript:ventana('../../Movimientos/Pedidos_1/BUSCARITEM.jsp');"> Buscar </a> </TD> <TD width="60%"> <input name="itm_nombre" type="text" id="itm_nombre" value="" maxlength="250" STYLE="text-transform:uppercase" readonly disabled> </TD> <TD width="10%"><INPUT type="text" id="cantidad"/> </TD> </tr> </tbody> </table>