
añadir un contador para un generador de filas
Publicado por Miguel Angel (5 intervenciones) el 18/11/2015 05:37:13
Buenas gente tengo este código...
Lo que hace es simplemente añadir una fila o eliminarla...
Pero tengo problemas al colocar un contador y empezar a contar las filas...
Xq si elimino una fila el contador no se resetea...
Un ejemplo...
Fila 1
Fila 2
Fila 3....
Si elimino digamos la fila 2...
Quedaría...
Fila 1
Fila 3...
Y no quiero eso...
Quiero que quede ...
Fila 1
Fila 2...
Que se resetee el contador...
X favor si alguien me ayuda... Gracias...
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
<html>
<head>
<title>Agregar y Eliminar Filas</title>
</head>
<script type="text/javascript" src="js/jquery-1.11.2.js"></script>
<script type="text/javascript">
$(function(){
//Clona la fila oculta que tiene los campos base y la agrega al final de la tabla
$("#agregar").on('click', function(){
$("#tabla tbody tr:eq(0)").clone().removeClass('fila-base').appendTo("#tabla tbody");
});
//Evento que selecciona la fila y la elimina
$(document).on("click",".eliminar",function(){
var parent = $(this).parents().get(0);
$(parent).remove();
});
});
</script>
<style type="text/css">
#tabla{
border: solid 1px #333;
width: 300px;
}
#tabla tbody tr{
background: #999;
}
.fila-base{ /*fila base oculta*/
display: none;
}
.eliminar{
cursor: pointer; color: #000;
}
input[type="text"]{
width: 80px; /*ancho a los elementos input*/
}
</style>
<body>
<table id="tabla">
<thead>
<tr>
<th>Nombre</th>
<th>Apellidos</th>
<th>Sexo</th>
<th> </th>
</tr>
<tbody>
<tr class="fila-base">
<td><input type="text" class="nombre"/></td>
<td><input type="text" class="apellidos"/></td>
<td>
<select class="sexo">
<option value="0">- Sexo -</option>
<option value="M">Masculino</option>
<option value="F">Femenino</option>
</select>
</td>
<td class="eliminar">Eliminar</td>
</tr>
<tr>
<td><input type="text" class="nombre"/></td>
<td><input type="text" class="apellidos"/></td>
<td>
<select class="sexo">
<option value="0">- Sexo -</option>
<option value="M">Masculino</option>
<option value="F">Femenino</option>
</select>
</td>
<td class="eliminar">Eliminar</td>
</tr>
</tbody>
</thead>
</table>
<input type="button" id="agregar" value="Agregar fila"/>
</body>
</html>
Lo que hace es simplemente añadir una fila o eliminarla...
Pero tengo problemas al colocar un contador y empezar a contar las filas...
Xq si elimino una fila el contador no se resetea...
Un ejemplo...
Fila 1
Fila 2
Fila 3....
Si elimino digamos la fila 2...
Quedaría...
Fila 1
Fila 3...
Y no quiero eso...
Quiero que quede ...
Fila 1
Fila 2...
Que se resetee el contador...
X favor si alguien me ayuda... Gracias...
Valora esta pregunta


0