Question

I have looked all over and cannot figure out why this code isn’t working.

http://jsfiddle.net/kCLxJ/

When the drop down is set to value “3” or “4”, then another field should pop up below the drop down list.
Any ideas?

Answer 1

Fixed Working Version

First you needed to call .val() like it was pointed out.

var val = $('#event_options_id option:selected').val();

Then based on the selector you are using you need to use parseInt() on the val to make it a number like so

if ($.inArray(parseInt(val,10), arr) > -1) {

You also had an extra comma when defining your array.

Full Working Code

$(document).ready(function() {

    $('#event_options_id').change(function() {

        $('.container_add_form').remove();

        var val = $('#event_options_id option:selected').val();
        var arr = [3, 4];

        if ($.inArray(parseInt(val,10), arr) > -1) {
            $('<input type="hidden" name="age_required" id="age_required" value="yes" /><div class="container_add_form"><p class="text_content">Please enter your age for grouping purposes.<br /><input name="age" type="text" id="age" size="3" /></p></div>').fadeIn('slow').appendTo('.add_form');
        }
    });
});​