How to set the SELECTED property of dropdown in jQuery?

Question

I am sending the index number of dropdown's options that users selects from index. Now want to select that specific option as 'selected' on another view. How to make it using jQuery?

$('#book_selection').attr("disabled", "disabled");
$('#book_selection').selectedIndex = 1;

but its not working...

Answer 1

Use prop() method, setting selectedIndex to a jQuery object practically does nothing. As of jQuery 1.6 for modifying properties prop method should be used instead of attr method:

$('#book_selection').prop("disabled", true)
                    .prop('selectedIndex', 1);

Alternatives:

// Getting the DOM element object using bracket notation and `.get()` method
$('#book_selection')[0].selectedIndex = 1;
$('#book_selection').get(0).selectedIndex = 1;

Answer 2

Use .prop() for setting the properties, By the way you are in need to set the value by using index, so in that case .eq(index) will help you.

Try,

$('#book_selection option').eq(1).prop('selected',true);