Bom no exemplo que eu postei eu consigo desabilitar os input valor1
, vendedor1
e supervisor1
ao marcar a opção recalcular1
.
O problema e que tenho um formulário com vários input, e para evitar um código muito grande eu queria fazer o jqeury identificar o número do checkbox
e desabilitar apenas os inputs do mesmo número.
Exemplo:
O recalcular1
desabilita dos campos valor1
, vendedor1
e supervisor1
.
O recalcular2
desabilita dos campos valor2
, vendedor2
e supervisor2
.
Alguém sabe uma forma prática de fazer isso?
$(document).ready(function() {
$("#recalcular1").on("blur change", function() {
// Verifica se exibe
if ($("#recalcular1").is(':checked')) {
$("#valor1").prop('disabled', true);
$("#vendedor1").prop('disabled', true);
$("#supervisor1").prop('disabled', true);
} else {
$("#valor1").prop('disabled', false);
$("#vendedor1").prop('disabled', false);
$("#supervisor1").prop('disabled', false);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' id='recalcular1' class='checkbox' name='recalcular1'>
<div>
<input type='text' id='valor1' name='valor1'>
<input type='text' id='vendedor1' name='vendedor1'>
<input type='text' id='supervisor1' name='supervisor1'>
<!-- Não pode ficar desabilitado -->
<input type='text' id='qtd1' name='qtd1'>
</div>
<br><br>
<input type='checkbox' id='recalcular2' class='checkbox' name='recalcular2'>
<div>
<input type='text' id='valor2' name='valor2'>
<input type='text' id='vendedor2' name='vendedor2'>
<input type='text' id='supervisor2' name='supervisor2'>
<!-- Não pode ficar desabilitado -->
<input type='text' id='qtd2' name='qtd2'>
</div>