JQuery для установки выпадающего в значение по умолчанию, когда значение другого выпадающего изменилось - PullRequest
0 голосов
/ 07 февраля 2012

У меня есть два выпадающих списка

@using (Html.BeginForm()) {
<fieldset>
        <legend></legend>
        <label>User details</label>

<section>
             @Html.LabelFor(model => model.Status)
             <div> @Html.DropDownList("Statuses", Model.Statuses(), "Select status", new { required = "required" }) </div>
             @Html.ValidationMessageFor(model => model.Status)       
        </section>  

        <section>
             @Html.LabelFor(model => model.Roles)
             <div> @Html.DropDownList("AvailableRoles", Model.AvailableRoles(), "Select role", new { required = "required" }) </div>
             @Html.ValidationMessageFor(model => model.Roles)       
        </section> 

        <section>
            <div><button>Edit</button></div>
        </section>
    </fieldset>
}

Я хочу написать некоторый JQuery, чтобы значение раскрывающегося списка состояний изменилось на значение по умолчанию при изменении значения раскрывающегося списка ролей. Есть идеи, как это сделать?

Спасибо

Сэчины

EDIT:

Сгенерированный HTML это:

<form method="post" action="/Admin/Account/EditUser?userName=user1">    <fieldset>
        <legend></legend>
        <label>User details</label>

        <section>
             <label for="UserName">User name</label>
             <div> <input type="text" value="user1" name="UserName" id="UserName" disabled="disabled"> </div>
             <span data-valmsg-replace="true" data-valmsg-for="UserName" class="field-validation-valid"></span>       
        </section>

        <section>
             <label for="Email">Email address</label>
             <div> <input type="text" value="sachinkainth@hotmail.com" required="required" name="Email" id="Email"> </div>
             <span data-valmsg-replace="true" data-valmsg-for="Email" class="field-validation-valid"></span>       
        </section>

        <section>
             <label for="Status">Status</label>
             <div> <select required="required" name="Statuses" id="Statuses"><option value="">Select status</option>
<option value="Approved" selected="selected">Approved</option>
<option value="Registered">Registered</option>
<option value="Suspended">Suspended</option>
</select> </div>
             <span data-valmsg-replace="true" data-valmsg-for="Status" class="field-validation-valid"></span>       
        </section>  

        <section>
             <label for="Approved">Approved</label>
             <div> <input type="checkbox" value="true" name="Approved" id="Approved" data-val-required="The Approved field is required." data-val="true" checked="checked"><input type="hidden" value="false" name="Approved"> </div>
             <span data-valmsg-replace="true" data-valmsg-for="Approved" class="field-validation-valid"></span>       
        </section>

        <section>
             <label for="FirstName">First name</label>
             <div> <input type="text" value="e" required="required" name="FirstName" id="FirstName"> </div>
             <span data-valmsg-replace="true" data-valmsg-for="FirstName" class="field-validation-valid"></span>       
        </section>

        <section>
             <label for="LastName">Last name</label>
             <div> <input type="text" value="e" required="required" name="LastName" id="LastName"> </div>
             <span data-valmsg-replace="true" data-valmsg-for="LastName" class="field-validation-valid"></span>       
        </section>

        <section>
             <label for="Roles">Roles</label>
             <div> <select required="required" name="AvailableRoles" id="AvailableRoles"><option value="">Select role</option>
<option value="Buyer" selected="selected">Buyer</option>
<option value="Seller">Seller</option>
</select> </div>
             <span data-valmsg-replace="true" data-valmsg-for="Roles" class="field-validation-valid"></span>       
        </section> 

        <section>
            <div><button>Edit</button></div>
        </section>
    </fieldset>
</form>

Ответы [ 2 ]

5 голосов
/ 07 февраля 2012

Использовать событие изменения ...

$("#AvailableRoles").change(function(){
   $("#Statuses").val("New Value");
});

Вот рабочий пример

4 голосов
/ 07 февраля 2012

Вы можете использовать событие change для этого.

$('select[name="AvailableRoles"]').change(function(){
   $('select[name="Statuses"]')[0].selectedIndex = 0;//Will select first option
});

Я думаю, что вспомогательный метод mvc будет отображать атрибут id, который совпадает с полем имени.В этом случае лучше использовать селектор идентификатора.

$('#AvailableRoles').change(function(){
   $('#Statuses')[0].selectedIndex = 0;//Will select first option
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...