CODEWITHSUNDEEP
javascriptjquery
Merve Kaya
Merve Kaya

Reputation: 1249

Change dropdownlist selected value with jquery

I have five dropdownlists on the form. I want that if user select something from one of dropdownlists, the other ones should be unselected. User can select something from just one dropdownlist.When he select something,selected value of other dropdownlists should be unselected. I'm using jquery

@foreach (var lay in Model.EventLayouts)
{
    <li>

    <select class="layoutSelect" layoutname="@lay.Name" layoutId="@lay.LayoutID" moderation="@lay.Moderation.ToString().ToLower()" selectedVal="0">

    <option value="0">@PageResources.Quantity</option>

    <option value="1">1</option>

    </select>

    </li>
}

Upvotes: 0

Views: 1132

Answers (3)

Sridhar R
Sridhar R

Reputation: 20418

Try this way

$(document).on('change', '.layoutSelect', function () {
if ($(this).find('option').is(":selected")) {
    $('.layoutSelect').not($(this)).val("");//val('0');
}
});

DEMO

Upvotes: 2

Bhushan Kawadkar
Bhushan Kawadkar

Reputation: 28523

Assuming that both dropdown has same class="layoutSelect" and unselect value="0", try below jQuery :

$('.layoutSelect').change(function(){
   $('.layoutSelect').not(this).val('0');
});

Demo

Upvotes: 2

Ehsan Sajjad
Ehsan Sajjad

Reputation: 62498

If you are trying to reset the other drop-downs but not the one which is changed, by adding same class on all drop-down you can do like this:

$(".layoutSelect").change(function(){

$(".layoutSelect").not(this).val(0);

})

FIDDLE EXAMPLE

Upvotes: 1

Related Questions