0

Pretendo tornar o campo "Idsiliamb" obrigatório, apenas quando o radio button "Empresa" é selecionado, caso o campo "Particular" for selecionado não acontecerá nada.

De momento quando seleciono o radio button "Empresa" o campo de texto "Idsiliamb" fica cintilante, mas no entanto não apresenta a mensagem de erro e permite-me inserir mesmo estando vazio.

<form class="form-horizontal"  method="POST" action="index.php?cmd=addter2" > 


   <div class="form-group">
    <label class="control-label col-sm-4" for="Idsiliamb"> Idsiliamb </label>
    <div class="col-sm-6"> 
      <input type="text" class="form-control" id="Idsiliamb" placeholder="Digite o Idsiliamb" name="Idsiliamb" onclick="document.getElementById('Empresa').checked=true">
    </div>
  </div>

   <div class="form-group">
    <label class="control-label col-sm-4" for="Tipo"> Tipo  </label>
    <div class="form-group">
    <input type="radio" name="Tipo" id='radio_r' value="Empresa" onclick="document.getElementById('Idsiliamb').focus()" required>Empresa
    <input type="radio" name="Tipo" id='radio_p' value="Particular" >Particular
    </div>


  </div>



  <br>
  <div class="form-group"> 
    <div class="col-sm-offset-4 col-sm-6">
      <button type="submit" class="btn btn-default">Adicionar Terceiros </button>
    </div>
  </div>
</form>

<script>
	$('input[name="Tipo"]').change(function () {
		if($("#Empresa").is(':checked')) {
			$('#Idsiliamb').attr('required', true);
		} else {
			$('#Idsiliamb').removeAttr('required');
		}
	});
</script>  
<style>
#Idsiliamb[required] {
    background: #FFAAAA;
}
</style>

2 Respostas 2

1

O id Empresa não existe, ele é um value. Logo, você pode verificar pelo value do radio:

$('input[name="Tipo"]').change(function () {
   if(this.value == "Empresa") {
      $('#Idsiliamb').attr('required', true);
   } else {
      $('#Idsiliamb').removeAttr('required');
   }
});

Pode, inclusive, usar um ternário:

$('input[name="Tipo"]').change(function () {
   $('#Idsiliamb').attr('required', this.value == "Empresa" ? true : false);
});

Exemplo:

$('input[name="Tipo"]').change(function () {
   $('#Idsiliamb').attr('required', this.value == "Empresa" ? true : false);
});
#Idsiliamb[required] {
    background: #FFAAAA;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form class="form-horizontal"  method="POST" action="index.php?cmd=addter2" > 


   <div class="form-group">
    <label class="control-label col-sm-4" for="Idsiliamb"> Idsiliamb </label>
    <div class="col-sm-6"> 
      <input type="text" class="form-control" id="Idsiliamb" placeholder="Digite o Idsiliamb" name="Idsiliamb" onclick="document.getElementById('Empresa').checked=true">
    </div>
  </div>

   <div class="form-group">
    <label class="control-label col-sm-4" for="Tipo"> Tipo  </label>
    <div class="form-group">
    <input type="radio" name="Tipo" id='radio_r' value="Empresa" onclick="document.getElementById('Idsiliamb').focus()" required>Empresa
    <input type="radio" name="Tipo" id='radio_p' value="Particular" >Particular
    </div>


  </div>



  <br>
  <div class="form-group"> 
    <div class="col-sm-offset-4 col-sm-6">
      <button type="submit" class="btn btn-default">Adicionar Terceiros </button>
    </div>
  </div>
</form>

1
  • Já reparei onde errei e fui corrigida, obrigada à mesma !
    – Someone
    Commented 30/04/2019 às 12:22
0

Tem que pegar o valor selecionado no radio, então no JS coloca if($('#radio_r:checked').val() == 'Empresa') { que vai funcionar

1
  • Funcionou! Muito obrigada :)
    – Someone
    Commented 30/04/2019 às 12:17

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 .