Hola chicos,
Estoy haciendo una página de estadísticas y estoy trabado. El objetivo es llenar un formulario con 16 inputs diferentes y este formulario se repite por 12.
Los inputs son numéricos y para facilitar la entrada de datos me gustaría poner dos botones, uno para incrementar y otro para disminuir, por uno, cada input.
Hasta el momento he conseguido aumentar un input. Pero tengo una función para aumentar y disminuir ese input, pero de mi forma necesitaría una función para cada input y cada formulario. Eso son 192 funciones! jajaj, va, fuera bromas, seguro que se puede de otra forma y no doy con la tecla. Llevo horas dándole a la página y estoy colapsado, si alguien tiene una idea, perfecto!
Os dejo parte del código por si ayuda!
Script:
Código:
<script type="text/javascript">
$(document).ready(function(){
$('#min1c').click(function(){
//Si es diferente que 0
if ($('#1c').val() != 0)
//disminuir
$('#1c').val(parseInt($('#1c').val()) - 1);
});
$('#plus1c').click(function(){
//Aumentar
$('#1c').val(parseInt($('#1c').val()) + 1);
});
});
$(document).ready(function(){
$('#min1f').click(function(){
if ($('#1f').val() != 0)
$('#1f').val(parseInt($('#1f').val()) - 1);
});
$('#plus1f').click(function(){
$('#1f').val(parseInt($('#1f').val()) + 1);
});
});
$(document).ready(function(){
$('#min2c').click(function(){
if ($('#2c').val() != 0)
$('#2c').val(parseInt($('#2c').val()) - 1);
});
$('#plus2c').click(function(){
$('#2c').val(parseInt($('#2c').val()) + 1);
});
$(document).ready(function(){
$('#min2f').click(function(){
if ($('#2f').val() != 0)
$('#2f').val(parseInt($('#2f').val()) - 1);
});
});
$('#plus2f').click(function(){
$('#2f').val(parseInt($('#2f').val()) + 1);
});
});
</script>
HTML:
Código:
<form name="j1">
<table class="">
<tbody>
<tr>
<td colspan="2">04 - Albert Carnero</td>
</tr>
<tr>
<td>
1c<a id="min1c" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="1c" id="1c" value="0" class="input-small" />
<a id="plus1c" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
<td>
1f<a id="min1f" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="1f" id="1f" value="0" class="input-small" />
<a id="plus1f" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td>
2c<a id="min2c" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="2c" id="2c" value="0" class="input-small" />
<a id="plus2c" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
<td>
2f<a id="min2f" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="2f" id="2f" value="0" class="input-small" />
<a id="plus2f" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td>
3c<a id="min3c" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="3c" id="3c" value="0" class="input-small" />
<a id="plus3c" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
<td>
3f<a id="min3f" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="3f" id="3f" value="0" class="input-small" />
<a id="plus3f" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td>
ro<a id="minro" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="ro" id="ro" value="0" class="input-small" />
<a id="plusro" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
<td>
rd<a id="minrd" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="rd" id="rd" value="0" class="input-small" />
<a id="plusrd" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td colspan="2">
as<a id="minas" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="as" id="as" value="0" class="input-small" />
<a id="plusas" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td>
fc<a id="minfc" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="fc" id="fc" value="0" class="input-small" />
<a id="plusfc" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
<td>
fr<a id="minfr" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="fr" id="fr" value="0" class="input-small" />
<a id="plusfr" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td>
bp<a id="minpp" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="pp" id="pp" value="0" class="input-small" />
<a id="pluspp" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
<td>
br<a id="minpr" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="pr" id="pr" value="0" class="input-small" />
<a id="pluspr" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td>
ta<a id="minta" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="ta" id="ta" value="0" class="input-small" />
<a id="plusta" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td>
pt<a id="minpt" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="pt" id="pt" value="0" class="input-small" />
<a id="pluspt" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
<tr>
<td>
va<a id="minva" style="cursor:pointer;"><i class="icon-minus"></i></a>
<input name="va" id="va" value="0" class="input-small" />
<a id="plusva" style="cursor:pointer;"><i class="icon-plus"></i></a>
</td>
</tr>
</tbody>
</form>
Se que el código html no esta muy limpio, así que si os lia mucho, me sirve una buena explicación, gracias!