1

Tenho uma pergunta de radio button:

<div class="row">
    <div class="col-lg-1">
        <div class="radio">
            <label>
                <input type="radio" name="dirar" value="1">
                Sim
            </label>
        </div>
    </div>
    <div class="col-lg-2">
        <div class="radio">
            <label>
                <input type="radio" name="dirar" value="0">
                Não
            </label>
        </div>
    </div>
    // Validação de erro caso não tenha selecionado uma opção msg = "Campo Obrigatório"
    <div class="col-lg-3">
        <label id="dirar-error" class="input-error" for="dirar" style="border: none; color: red;"></label>
    </div>
</div>

Se name="dirar" for selecionado '0' = não, preciso de uma validação que adicione required="required" a uma outra questão que está abaixo:

<div class="row">
    <div class="col-lg-1">
        <div class="radio">
            <label>
                <input type="radio" name="isubrar" value="1">
                Sim
            </label>
        </div>
    </div>
    <div class="col-lg-2">
        <div class="radio">
            <label>
                <input type="radio" name="isubrar" value="0">
                Não
            </label>
        </div>
    </div>
</div>

Resumindo, se name="dirar" for '0' = Não o segundo radio button name="isubrar" torna-se um campo obrigatório ou se name="dirar"for '1' = Sim name="isubrar"não será um campo obrigatório.

1
  • O que você já tentou? Recebeu algum erro?
    – jlHertel
    22/03/2017 às 14:57

1 Resposta 1

1

Segue uma implementação funcional:

$(":radio[name='dirar']").change(function(){
  if($(this).val() === "0") {
    $(":radio[name='isubrar']").attr("required", "required");
  } else {
    $(":radio[name='isubrar']").removeAttr("required");
  }
  
  console.log($(":radio[name='isubrar']").attr("required"));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
    <div class="col-lg-1">
        <div class="radio">
            <label>
                <input type="radio" name="dirar" value="1">
                Sim
            </label>
        </div>
    </div>
    <div class="col-lg-2">
        <div class="radio">
            <label>
                <input type="radio" name="dirar" value="0">
                Não
            </label>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-lg-1">
        <div class="radio">
            <label>
                <input type="radio" name="isubrar" value="1">
                Sim
            </label>
        </div>
    </div>
    <div class="col-lg-2">
        <div class="radio">
            <label>
                <input type="radio" name="isubrar" value="0">
                Não
            </label>
        </div>
    </div>
</div>

1
  • Funcionou Perfeitamente @Marcell_Alves, Obrigado! 22/03/2017 às 17:20

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .