Skip to main content
adicionou 242 caracteres ao conteúdo
Fonte Link
Hugo Borges
  • 5,4mil
  • 12
  • 58
  • 117

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>

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>

<input type='checkbox' id='recalcular1' class='checkbox' name='recalcular1'>
<input type='text' id='valor1' name='valor1'>
<input type='text' id='vendedor1' name='vendedor1'>
<input type='text' id='supervisor1' name='supervisor1'>


<br><br>

<input type='checkbox' id='recalcular2' class='checkbox' name='recalcular2'>
<input type='text' id='valor2' name='valor2'>
<input type='text' id='vendedor2' name='vendedor2'>
<input type='text' id='supervisor2' name='supervisor2'>

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>

Fonte Link
Hugo Borges
  • 5,4mil
  • 12
  • 58
  • 117

Desativar sequencia de input com jQuery

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>

<input type='checkbox' id='recalcular1' class='checkbox' name='recalcular1'>
<input type='text' id='valor1' name='valor1'>
<input type='text' id='vendedor1' name='vendedor1'>
<input type='text' id='supervisor1' name='supervisor1'>


<br><br>

<input type='checkbox' id='recalcular2' class='checkbox' name='recalcular2'>
<input type='text' id='valor2' name='valor2'>
<input type='text' id='vendedor2' name='vendedor2'>
<input type='text' id='supervisor2' name='supervisor2'>