Skip to main content
Edição para mostrar formulario e jquery completo
Fonte Link
Gabriel
  • 353
  • 2
  • 8
  • 24

########## EDIÇÃO

Segue o formulário completo:

<div class="form-group">
  <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">Forma de pagamento <span class="required">*</span></label>
  <div class="col-md-6 col-sm-6 col-xs-12">
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-1" value="1" <?php echo ($vformapagamento == '1')?'checked':'';?> > Boleto Conta Um
    <br />
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-2" value="2" <?php echo ($vformapagamento == '2')?'checked':'';?> > Cartão Conta Um
    <br />
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-3" value="3" <?php echo ($vformapagamento == '3')?'checked':'';?> > Espécie <small><b>(R$)</b></small>
    <br />
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-4" value="4" <?php echo ($vformapagamento == '4')?'checked':'';?> > Depósito/Transferência
    <br />
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-5" value="5" <?php echo ($vformapagamento == '5')?'checked':'';?> > Cheque
    <br />
  </div>
</div>

<div class="form-group" id="gr-002">
  <label class="control-label col-md-3 col-sm-3 col-xs-12">Qtde. Parcelas <span class="required">*</span><br><small>Caso seja pagamento à vista, selecione 1</small> </small></label>
  <div class="col-md-3 col-sm-3 col-xs-12">
    <select class="form-control col-md-7 col-xs-12 select2_single forma" tabindex="-1" id="select-custom-field2"  name="custom_field[account][2]">
      <option></option>
      <?php
        for($a=1; $a<=12; $a++){
      ?>
      <option value="<?php echo $a;?>" <?php if($a == $vqtdeparcelas){ echo ' selected="selected"'; } ?> ><?php echo $a;?></option>
      <?php } ?>
    </select>
  </div>
</div>


<div class="form-group" id="gr-003">
  <label class="control-label col-md-3 col-sm-3 col-xs-12">Vencimento da 1ª parcela <small><b>(dia)</b></small> <span class="required">*</span></small></label>
  <div class="col-md-3 col-sm-3 col-xs-12">
    <select class="form-control col-md-7 col-xs-12 select2_single forma" tabindex="-1" id="select-custom-field3"  name="custom_field[account][3]">
      <option value="" id="vazio"></option>
      <?php
        $b = array(5,15); //  ######## DIAS PARA PAGAMENTO
        foreach($b as $key => $value){
      ?>
      <option value="<?php echo $value;?>" <?php if($value == $vvencimento){ echo ' selected="selected"'; } ?> ><?php echo $value;?></option>
      <?php } ?>
    </select>
  </div>
</div>

<div class="form-group" id="gr-004">
  <label class="control-label col-md-3 col-sm-3 col-xs-12">Data do recebimento<span class="required">*</span></label>
  <div class="col-md-3 col-sm-3 col-xs-12">
    <input type="text" class="form-control col-md-7 col-xs-12 forma" name="custom_field[account][4]" id="input-custom-field4" value="<?php echo $vdatarecebimento; ?>" data-inputmask="'mask' : '99/99/9999'">
    <br>
  </div>
</div>

E o jQuery completo:

$(document).ready(function() {
  $("#gr-002").hide();
  $("#gr-003").hide();
  $("#gr-004").hide();

  $('input:radio[name="custom_field[account][1]"]').on("change", function() {
    if (this.checked && this.value == '1') {
      $("#gr-002").show();
      $("#gr-003").show();
      $("#gr-004").hide();
    } if (this.checked && this.value == '2') {
      $("#gr-002").show();
      $("#gr-003").show();
      $("#gr-004").hide();
    } if (this.checked && this.value == '3') {
      $("#gr-004").show();
      $("#gr-002").hide();
      $("#gr-003").hide();
      $("#select-custom-field3").val('');
    } if (this.checked && this.value == '4') {
      $("#gr-004").show();
      $("#gr-002").hide();
      $("#gr-003").hide();
    } if (this.checked && this.value == '5') {
      $("#gr-002").show();
      $("#gr-003").show();
      $("#gr-004").hide();
    }
  });
});

########## EDIÇÃO

Segue o formulário completo:

<div class="form-group">
  <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">Forma de pagamento <span class="required">*</span></label>
  <div class="col-md-6 col-sm-6 col-xs-12">
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-1" value="1" <?php echo ($vformapagamento == '1')?'checked':'';?> > Boleto Conta Um
    <br />
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-2" value="2" <?php echo ($vformapagamento == '2')?'checked':'';?> > Cartão Conta Um
    <br />
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-3" value="3" <?php echo ($vformapagamento == '3')?'checked':'';?> > Espécie <small><b>(R$)</b></small>
    <br />
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-4" value="4" <?php echo ($vformapagamento == '4')?'checked':'';?> > Depósito/Transferência
    <br />
    <input type="radio" name="custom_field[account][1]" id="id-custom_field-account-1-5" value="5" <?php echo ($vformapagamento == '5')?'checked':'';?> > Cheque
    <br />
  </div>
</div>

<div class="form-group" id="gr-002">
  <label class="control-label col-md-3 col-sm-3 col-xs-12">Qtde. Parcelas <span class="required">*</span><br><small>Caso seja pagamento à vista, selecione 1</small> </small></label>
  <div class="col-md-3 col-sm-3 col-xs-12">
    <select class="form-control col-md-7 col-xs-12 select2_single forma" tabindex="-1" id="select-custom-field2"  name="custom_field[account][2]">
      <option></option>
      <?php
        for($a=1; $a<=12; $a++){
      ?>
      <option value="<?php echo $a;?>" <?php if($a == $vqtdeparcelas){ echo ' selected="selected"'; } ?> ><?php echo $a;?></option>
      <?php } ?>
    </select>
  </div>
</div>


<div class="form-group" id="gr-003">
  <label class="control-label col-md-3 col-sm-3 col-xs-12">Vencimento da 1ª parcela <small><b>(dia)</b></small> <span class="required">*</span></small></label>
  <div class="col-md-3 col-sm-3 col-xs-12">
    <select class="form-control col-md-7 col-xs-12 select2_single forma" tabindex="-1" id="select-custom-field3"  name="custom_field[account][3]">
      <option value="" id="vazio"></option>
      <?php
        $b = array(5,15); //  ######## DIAS PARA PAGAMENTO
        foreach($b as $key => $value){
      ?>
      <option value="<?php echo $value;?>" <?php if($value == $vvencimento){ echo ' selected="selected"'; } ?> ><?php echo $value;?></option>
      <?php } ?>
    </select>
  </div>
</div>

<div class="form-group" id="gr-004">
  <label class="control-label col-md-3 col-sm-3 col-xs-12">Data do recebimento<span class="required">*</span></label>
  <div class="col-md-3 col-sm-3 col-xs-12">
    <input type="text" class="form-control col-md-7 col-xs-12 forma" name="custom_field[account][4]" id="input-custom-field4" value="<?php echo $vdatarecebimento; ?>" data-inputmask="'mask' : '99/99/9999'">
    <br>
  </div>
</div>

E o jQuery completo:

$(document).ready(function() {
  $("#gr-002").hide();
  $("#gr-003").hide();
  $("#gr-004").hide();

  $('input:radio[name="custom_field[account][1]"]').on("change", function() {
    if (this.checked && this.value == '1') {
      $("#gr-002").show();
      $("#gr-003").show();
      $("#gr-004").hide();
    } if (this.checked && this.value == '2') {
      $("#gr-002").show();
      $("#gr-003").show();
      $("#gr-004").hide();
    } if (this.checked && this.value == '3') {
      $("#gr-004").show();
      $("#gr-002").hide();
      $("#gr-003").hide();
      $("#select-custom-field3").val('');
    } if (this.checked && this.value == '4') {
      $("#gr-004").show();
      $("#gr-002").hide();
      $("#gr-003").hide();
    } if (this.checked && this.value == '5') {
      $("#gr-002").show();
      $("#gr-003").show();
      $("#gr-004").hide();
    }
  });
});
Fonte Link
Gabriel
  • 353
  • 2
  • 8
  • 24

Limpar opção selecionada de um select com jQuery

Estou com um formulário com radio buttons, e quando vou selecionando os radio buttons ele vai aparecendo/escondendo os campos que quero.

Até aí ta beleza, mas, se eu seleciono uma opção no e depois mudo de radio button, aquele campo some, mas, não limpa o valor escolhido nele, então se mandar o formulário, o valor é passado, mesmo o campo estando escondido.

Alguém saberia como limpar a opção selecionada do ? Ja tentei com .empty(), mas aí ele apaga todos os valores do .

formulario:

<div class="form-group" id="gr-003">
<label class="control-label col-md-3 col-sm-3 col-xs-12">Vencimento da 1ª parcela <small><b>(dia)</b></small> <span class="required">*</span></small></label>
<div class="col-md-3 col-sm-3 col-xs-12">
    <select class="form-control col-md-7 col-xs-12 select2_single forma" tabindex="-1" id="select-custom-field3"  name="custom_field[account][3]">
        <option value="" id="vazio"></option>
            <?php
                $b = array(5,15); //  ######## DIAS PARA PAGAMENTO
                foreach($b as $key => $value){
            ?>
        <option value="<?php echo $value;?>" <?php if($value == $vvencimento){ echo ' selected="selected"'; } ?> ><?php echo $value;?></option>
            <?php } ?>
    </select>
</div>

E o jQuery:

if (this.checked && this.value == '3') {
$("#gr-004").show();
$("#gr-002").hide();
$("#gr-003").hide();
$("#select-custom-field3").empty().append("#gr-003");

Desde já agradeço!