2

I recently posted about a problem I was having with not being about to ge the .val() from a selected dropdown. The code was correct but something was preventing the on change from firing correctly. I've narrowed the issue down and found when I remove the select box plugin it works as expected. Can someone please help me get both to work, I'd like to keep select box on these dropdown && also write my own function that will pick up the selected value.

thanks.

Relevant code:

<div class="form-group">
    <select name="numberOfAdults" id="numberOfAdults" tabindex="2">
        <option>-Adults-</option>
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>
</div>

In script.js

//---------------------------------------------------
//------------------- Selectbox -------------------
//---------------------------------------------------
$(function () {
    $("#numberOfAdults").selectbox();
    $("#numberOfKids").selectbox();
    $("#eventAttending").selectbox();
});

mt script that doesn't give me the value, instead it will also give '-Adults- - -Adults-'

<script>
    $('#numberOfAdults').change(function() {
        var val1 = this.value;
        var val2 = $('#numberOfAdults option:selected').val();
        alert(val1 + " - " + val2);
    });

result: enter image description here

Mike Cluck
  • 31,869
  • 13
  • 80
  • 91
null
  • 3,469
  • 7
  • 41
  • 90
  • The plugin probably creates a list instead of a select to make it stylable, so the `change` event doesn't fire, and the plugin probably has it's own events instead, meaning, read the fracking manual. – adeneo Jan 11 '16 at 19:54
  • @adeneo, thanks for your valuable input – null Jan 11 '16 at 19:55
  • Really, it's right there, the `onChange` event, it even has an example – adeneo Jan 11 '16 at 19:58

1 Answers1

3

You can try something like this:

$('#numberOfAdults').selectbox({
      onChange: function (val, inst) {
         alert(val);
      }        
});

Documentation: http://www.bulgaria-web-developers.com/projects/javascript/selectbox/

Hackerman
  • 12,139
  • 2
  • 34
  • 45
  • just literally tried $('#numberOfAdults').selectbox({ onChange: function() { var val1 = this.value; var val2 = $('#numberOfAdults option:selected').val(); alert(val1 + " - " + val2); } }); but no joy, however, my params are none. – null Jan 11 '16 at 20:02
  • added params and worked perfectly, thank you for your help and time. – null Jan 11 '16 at 20:03
  • @SteveGreen, i'm glad to help :) – Hackerman Jan 11 '16 at 20:04