I have a select menu that looks like this:

<select id ="cal-category-select">
    <option value="/event-sort/list/2009/9/sports/">Sports Events</option>
    <option value="/event-sort/list/2009/9/fine-arts/">Fine Arts Events</option>
    ...
</select>

When the user selects an option from the select, I need to pass the option value attribute to this function as event data, it's the second parameter:

$('#cal-category-select').bind('change.filter', need_value_attribute_here, update_cal);

The update_cal function referenced receives the data passed in from the second parameter and using to get some ajax content.

Any idea how I can do that? I haven't been able to get it to work.

I have tried this:

var category_url = $('#cal-category-select option:selected').attr('value');
$('#cal-category-select').unbind().bind('change.filter', category_url, update_cal);

but that only returns the first option value in the list.

I have a select menu that looks like this:

<select id ="cal-category-select">
    <option value="/event-sort/list/2009/9/sports/">Sports Events</option>
    <option value="/event-sort/list/2009/9/fine-arts/">Fine Arts Events</option>
    ...
</select>

When the user selects an option from the select, I need to pass the option value attribute to this function as event data, it's the second parameter:

$('#cal-category-select').bind('change.filter', need_value_attribute_here, update_cal);

The update_cal function referenced receives the data passed in from the second parameter and using to get some ajax content.

Any idea how I can do that? I haven't been able to get it to work.

I have tried this:

var category_url = $('#cal-category-select option:selected').attr('value');
$('#cal-category-select').unbind().bind('change.filter', category_url, update_cal);

but that only returns the first option value in the list.

• javascript
• jquery
• jquery-events

• Is change.filter your own defined custom event? – Russ Cam Commented Sep 28, 2009 at 14:18
• 1 it's the change event with the filter namespace – user26858 Commented Sep 28, 2009 at 14:42

3 Answers 3

You would just use:

$("#cal-category-select").val()

alternative longer syntax:

$('#cal-category-select option:selected').val()

$('#cal-category-select').bind('change.filter', function(){
  update_cal($(this).val());
});

For the selected <option> value, it should just be

$('#cal-category-select').val();