Help with two select, fill values correctly

Asked

Viewed 37 times

1

Good afternoon.

I need to put in my form two select, and the second has to present values according to the choice of the first.

In the example that I was told, I adapted according to the code below, but whenever I execute the code it takes the last value. I wanted when selecting for example Visa , appeared 1 (first installment), if I select Master, that also appeared parcel 1. I don’t understand where I’m going wrong, because you’re always selecting the last parcel.

Could you give me a hand with that?

Grateful

var parcelas = $('select[name="Parcela"] option');
$('select[name="Bandeira"]').on('change', function () {
    var Bandeira = this.value;
    var novoSelect = parcelas.filter(function () {
        return $(this).data('bandeira') == Bandeira;
    });
    $('select[name="Parcela"]').html(novoSelect);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="row">
<div class="form-group col-md-3">
<select class="form-control" id="cartaoBandeira" name="Bandeira" required>
<option value="">Selecione o Cartão...</option>
<option value="Visa">Visa</option>
<option value="MasterCard">MasterCard</option>
</select>
  
<div class="row">
<div class="form-group col-md-3">
<select class="form-control" id="cartaoParcela" name="Parcela" required>
  <option data-bandeira="" value="">...</option>
<option data-bandeira="Visa" value="1">1</option>
<option data-bandeira="Visa" value="2">2</option>
<option data-bandeira="Visa" value="3">3</option>
<option data-bandeira="MasterCard" value="1">1</option>
<option data-bandeira="MasterCard" value="2">2</option>
<option data-bandeira="MasterCard" value="3">3</option>
<option data-bandeira="MasterCard" value="4">4</option>
<option data-bandeira="MasterCard" value="5">5</option>


</select>

  • http://answall.com/search?q=select+din%C3%A2mico

  • Just use the event change in the first select and then load the other. $('#cartaoBandeira').change(function () { // carregar dados em cartaoParcela });

  • I’m seeing the example where my question was marked as duplicate. Testing this tip.

  • @Sergio, I’ve already modified it to avoid duplicity.

  • @Amandarj after Dit the question was answered :) Now the problem looks different, which is de-select by default right?

  • @That Sergio. I change something?

Show 1 more comment
No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.