javascript | jquery

Set selected option by value via jQuery

This article describes how to set the selected option in a select by its value via jQuery.

Abhith Rajan
Abhith RajanAugust 19, 2017 · 1 min read · Last Updated:

In one of my projects, there is a search page which has few filters including linked selects, i.e the options displayed in a child select is dependent upon the option selected in another (parent). (like when we choose a country (parent), we have to show the states under the selected country in the child.)

After selecting both select, when we submit the search, it loads search result page with same filters above. The problem is that the child select value is not retained. Since when we assign the parent select selected value, it will trigger an ajax call and its response is bound to the child select.

To retain the filters as users selected, we had to set the selected value in the child select also. My child select is (Razor)

@Html.DropDownList("childSelectName", items, new { @name = "someName" })

And inside my ajax call on parent select on change, after binding all the available option to the child select,

if (selectedChildItemId) {

In short,


Replace the Controls_ID with your select tag Id and value with the selected item value.

This page is open source. Noticed a typo? Or something unclear?
Improve this page on GitHub

Abhith Rajan

Written byAbhith Rajan
Abhith Rajan is a software engineer by day and a full-stack developer by night. He's coding for almost a decade now. He codes 🧑‍💻, write ✍️, learn 📖 and advocate 👍.

Is this page helpful?

Related SnippetsView All

Related ArticlesView All

Related VideosView All

Why pnpm?

Easy NPM Package Updates with Yarn Upgrade Interactive

The Async Await Episode I Promised