I have a dropdownlist in my page: (results is a div)
<%
using (Ajax.BeginForm("MembersByClubSearch", new AjaxOptions { UpdateTargetId = "results" }))
{
%>
<%= Html.DropDownList("ddlClub开发者_StackOverflow社区s", new SelectList(Model.ClubNameList, "ClubID", "ClubName"), new { onchange = "this.form.submit();" })%>
<%
}
%>
My Action is
public ActionResult MembersByClubSearch(string query)
{
members = ... // code to get the List<> of members
if (Request.IsAjaxRequest())
{
return View("MembersByClubSearchResultUserControl", members);
}
else
{
return View(members);
}
}
But the submit of my dropdownlist isn't an AjaxRequest. When I use a submit button, it works fine, but I want to submit when the user changes the dropdown instead of changing dropdown AND clicking a button.
Any ideas?
thanks,
Filip
I would recommend you to get rid of MSAjax and use jquery along with the form plugin:
<% using (Html.BeginForm("MembersByClubSearch", "Home")) { %>
<%= Html.DropDownListFor(
x => x.SelectedClubId,
new SelectList(Model.ClubNameList, "ClubID", "ClubName"),
new { id = "club" }
) %>
<% } %>
And in a separate js file:
$(function() {
// Ajaxify the form => this is for normal submit
$('form').ajaxForm(function(result) {
$('#results').html(result);
});
// When the value of the dropdown changes force an ajax submit
$('#club').change(function() {
$('form').ajaxSubmit();
});
});
This is because the this.form.submit();
javascript function performs a traditional HTTP POST on your form. You need to send an AJAX style POST to your controller instead in order to trigger the if (Request.IsAjaxRequest())
statement.
I would use JQuery and the $.post() function, which allows you to specify a callback function to update your partial view.
There is a good example here that may help you: Dynamic-Select-Lists-with-MVC-and-jQuery
精彩评论