Вызов конкретного действия с выбором выпадающего списка в MVC
У меня есть выпадающий список в представлении MVC. На изменении выбора выпадающего списка я хочу назвать определенный метод действия в контроллере.
То, что я сделал выставленный для обозрения, является этим:
<%=Html.DropDownList("ddl", ViewData["AvailableList"] as SelectList,
new { onchange = "this.form.action='MyMethod';this.form.submit();" })%>
Все становится скомпилированным. Но исключение на этапе выполнения выдается, когда я изменяю выпадающий выбор, как
"Микроотсейте Ошибку периода выполнения JScript: Объект не поддерживает свойство или метод"
Как я могу перенаправить к определенному действию с событием изменения выбора списка?
Как я могу передать параметры этому методу действия?
5 ответов
Ваш подход должен работать. Проблема, с которой вы столкнулись, заключается в том, что вы используете этот в своем событии onchange недействительно. Попробуйте заменить ссылки this.form на что-то вроде этого:
<%= Html.DropDownList(
"ddl", ViewData["AvailableList"] as SelectList,
new { onchange = @"
var form = document.forms[0];
form.action='MyMethod';
form.submit();"
} ) %>
Из действия контроллера вы сделаете вызов тем же самым способом:
<%= Html.DropDownList(ddl, ViewData["items"] as SelectList, new { onchange = string.format("doSomething({0}); return false;", action) }) %>
Как только вы это сделаете, поместите на вашу страницу Javascript-функцию, которая вызывает метод. Однако способ вызова будет зависеть от того, будет ли это вызов AJAX или нет. То есть, хотите ли вы, чтобы страница проходила круглосуточно или нет. Для вызова не-AJAX:
function doSomething(action) {
window.location.href = action;
}
Если это вызов AJAX:
function doSomething(action) {
$.load(action);
}
Для передачи параметров к действию, вам просто нужно убедиться, что все элементы данных, которые вы хотите передать, содержатся в теге . Например, скажем, вы хотите включить имя и фамилию в выпадающий список. Видно, что вы сделаете что-то вроде этого:
<%= using (Html.BeginForm())
{ %>
<table>
<tr>
<td>First Name:</td>
<td><%= Html.TextBox("FirstName") %></td>
</tr>
<tr>
<td>Last Name:</td>
<td><%= Html.TextBox("LastName") %></td>
</tr>
<tr>
<td>Assign to:</td>
<td><%= Html.DropDownList(ddl, ViewData["items"] as SelectList,
new { onchange = string.format("doSomething({0}); return false;", ViewData["action"]) }) %></td>
<tr>
</table>
<% } %>
В функции Javascript:
function doSomething(action) {
var firstName = $('#FirstName').val();
var lastName = $('#LastName').val();
$.load(action, { first: firstName, last: lastName });
}
Вам действительно нужно отправить форму? Вы можете перенаправить:
onchange = "redirect(this.value)"
где перенаправление - это настраиваемая функция:
function redirect(dropDownValue) {
window.location.href = '/myController/myAction/' + dropDownValue;
}
Это jQuery. Дайте ему класс и подключитесь к нему.
Html.DropDownList("ddl", AvailableList, new { @class = "_select_change" })
Примерный сценарий может выглядеть так:
$('._select_change').change(function() { $.post(ctrlUrl); })
Как и оба: D
Я предлагаю смесь - мне очень нравится jQuery.
$('ddl').change(
function() {
// This contains your selected option val
$(this).val();
// so you can do domething like...
$.post(
$(this).val(),
{ Param1: xxxx,
Param2: xxxx,
Param3: xxxx },
function(data) {
// handle your call here. 'data' contains the response
} );
}