guardar filas dinamicas de tabla jquery PHP
Publicado por Alexi (30 intervenciones) el 08/01/2014 23:31:02
Hola primeramente gracias por leer mi pregunta.. mi problema es el siguiente:
tengo una tabla que hace agrega filas dinamicas
que agrego por medio de un boton, algo como una factura donde
tengo una cabecera y su respectivo detalle se agrega dinamicamente dependiendo lo que necesite el usuario ingresar
luego tengo un boton guardar aqui quiero recorrer todas las filas de la tabla y enviarla a guardar a la base.
Actualmente tengo este script para agregar filas a la tabla.
Script JS
Form
Encontre de esta manera recorrer las filas con JQUERY pero no se como enviar la informacion a insertar a la base
Espero me puedan brindar su ayuda.
tengo una tabla que hace agrega filas dinamicas
que agrego por medio de un boton, algo como una factura donde
tengo una cabecera y su respectivo detalle se agrega dinamicamente dependiendo lo que necesite el usuario ingresar
luego tengo un boton guardar aqui quiero recorrer todas las filas de la tabla y enviarla a guardar a la base.
Actualmente tengo este script para agregar filas a la tabla.
Script JS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
$(document).ready(function(){
fn_dar_eliminar();
fn_cantidad();
$("#frm_usu").validate({ });
});
function fn_cantidad(){
cantidad = $("#grilla tbody").find("tr").length;
$("#span_cantidad").html(cantidad);
};function fn_agregar(){
cadena = "<tr>";
cadena = cadena + "<td>" + $("#valor_ide").val() + "</td>";
cadena = cadena + "<td>" + $("#valor_uno").val() + "</td>";
cadena = cadena + "<td>" + $("#valor_dos").val() + "</td>";
cadena = cadena + "<td>" + $("#valor_tres").val() + "</td>";
cadena = cadena + "<td><a class='elimina'><img src='../css/images/delete.png' /></a></td>";
$("#grilla tbody").append(cadena);
fn_dar_eliminar();
fn_cantidad();
};function fn_dar_eliminar(){
$("a.elimina").click(function(){
id = $(this).parents("tr").find("td").eq(0).html();
respuesta = confirm("Desea eliminar el detalle: " + id);
if (respuesta){
$(this).parents("tr").fadeOut("normal", function(){
$(this).remove();
// alert("detalle " + id + " eliminado")
})
}});
};Form
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
</table>
<table class="formulario" border="0"><br />
<thead >
<tr >
<th colspan="8" valign="middle"><img src="../css/images/add.png" /> Agregar Detalle</th>
</tr>
</thead>
<tbody border="1">
<tr>
<td>Cantidad</td>
<td><input name="valor_ide" type="text" id="valor_ide" size="5" class="required" /></td>
<td>Descripción</td>
<td><input name="valor_uno" type="text" id="valor_uno" size="40" class="required" /></td>
<td>Precio Unitario</td>
<td><input name="valor_dos" type="text" id="valor_dos" size="5" class="required" /></td>
<td>Valor Total</td>
<td><input name="valor_tres" type="text" id="valor_tres" size="5" class="required" /></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="1"><input name="agregar" type="submit" id="agregar" value="Agregar" /></td>
</tr>
</tfoot>
</table>
</form>
<table id="grilla" class="lista" border="0" >
<thead >
<tr>
<th>Cantidad</th>
<th >Descripción</th>
<th>Precio Unitario</th>
<th>Valor Total</th>
</tr>
</thead>
<tbody>
<tr>
<td>2</td>
<td>Libro de Literaturaibujo</td>
<td>5.99</td>
<td>11.98</td>
<td><a class="elimina"><img src="../css/images/delete.png" /></a></td>
</tr>
<tr>
<td>2</td>
<td>Harold</td>
<!--<td>Chiguay</td>--><td>kenshines@hotmail.com</td>
<td>Ticona</td>
<td><a class="elimina"><img src="../css/images/delete.png" /></a></td>
</tr>
<tr>
<td>3</td>
<td>Howard</td>
<!--<td>Chiguay</td>--><td>copa_howard@hotmail.com</td>
<td>Ticona</td>
<td><a class="elimina"><img src="../css/images/delete.png" /></a></td>
</tr>
<tr>
<td>4</td>
<td>Gissella</td>
<!--<td>Ticona</td>--><td>conecienta@hotmail.com</td>
<td>Ticona</td>
<td><a class="elimina"><img src="../css/images/delete.png" /></a></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="8"><strong>Cantidad:</strong> <span id="span_cantidad">4</span> articulos.</td>
</tr>
<tr>
<td colspan="1"><input name="guardar" type="submit" id="guardar" value="Guardar" /></td>
</tr>
</tfoot>
</table>
Encontre de esta manera recorrer las filas con JQUERY pero no se como enviar la informacion a insertar a la base
1
2
3
4
5
6
7
$('#grilla tr').each(function () {
var cantidad= $(this).find('td').eq(0).html();
var descripcion = $(this).find('td').eq(1).html();
var valorUnitario = $(this).find('td').eq(3).html();
});
Valora esta pregunta
0
