mitomed
mitomed

Reputation: 2066

Reset jquery ui selectmenu dropdown to default option

I have a dropdown select menu rendered via this code

@Html.DropDownListFor(m => m.OwnedItemId, Model.Plans, "Select a plan type", new {@class = "selectMenu", id="addPlanSelectmenu"})

In the view it looks something like this:

<select class="selectMenu" data-val="true" data-val-number="The field OwnedItemId must   be a number." id="addPlanSelectmenu" name="OwnedItemId" aria-disabled="false"      style="display: none;">
    <option value="">Select a plan type</option>
    <option value="143863">RetirementSaving (143863)</option>
    <option value="143876">BankAccount (143876)</option>
    <option value="143913">RetirementSaving (143913)</option>
    <option value="143929">RetirementSaving (143929)</option>
    <option value="144030">BankAccount (144030)</option>

    ...
</select>

I would like to go to the default option after submitting but I can't make it work. So far I have tried quite a few things, like the one proposed in this answer, using

$('#addPlanSelectmenu').selectmenu("value", "");

Funny enough to my understanding if I do something like this

$('#addPlanSelectmenu').selectmenu("value", null); //Or an unexisting value

it goes back to the last option of the list.

Any idea?

Thanks

Edit: I forgot to mention that I guess a clean way is just adding a value to the default text, but I don't even know if it's possible with these helpers

Edit 2: I eventually made it work using this answer

Upvotes: 0

Views: 3181

Answers (4)

Arif Imtiaz
Arif Imtiaz

Reputation: 1

Well in MVC @Html.DropDownListFor this worked for me using jquery.

              if ('#resetButton').click(function(){
                 $("#id").select2('data', null);
               }

Upvotes: 0

Sayan
Sayan

Reputation: 2054

A little late to the party, however considering that all the other answers are either incorrect or incomplete, I'll throw in my 2 cents!

All you need to do is

$('.selectmenu').val(""); // your default option's value
$('.selectmenu').selectmenu("refresh");

Upvotes: 0

takacsot
takacsot

Reputation: 1767

Similar as resetting - the only solution working to me:

$('#resetButton').click(function() {
  $("#Service").selectmenu('destroy');
  $("#Service").prop('selectedIndex',0);
  $("#Service").selectmenu();
})';

Upvotes: 1

schabluk
schabluk

Reputation: 708

Try this code:

$('#addPlanSelectmenu').selectmenu("index", 0);

Upvotes: 1

Related Questions