Ajax.BeginForm ersetzt beim Ändern einer Dropdown-Liste die gesamte Seite

Die Absicht

Ich habe eine einfache Tabelle mit Namen (in einer Teilansicht) und darüber eine Dropdown-Liste mit diesen Namen. Der Zweck besteht darin, die Tabelle basierend auf dem in der Dropdown-Liste ausgewählten Namen zu filtern. Die Filterung sollte erfolgen, sobald sich der ausgewählte Wert in der Dropdown-Liste ändert, und sollte nur die Teilansicht wiedergeben.

Das Problem

Wenn ich einen Wert in der Dropdown-Liste auswähle, wird die Teilansicht nicht in der anderen Ansicht gerendert, sondern als ganze Seite angezeigt. Wenn ich jedoch eine Submit-Schaltfläche in meinen Ajax.BeginForm-Block einbinde und die Aktion für die Submit-Schaltfläche auslöse, funktioniert sie wie erwartet ...

Der Code

Regler

<code>public PartialViewResult Filter(string filterName) {
    var names = from p in db.People
                select p;

    if (!String.IsNullOrEmpty(filterName))
    {
        names = names.Where(p => p.Name.Equals(filterName));
    }

    return PartialView("_PersonsTable", names);
}
</code>

Aussicht

<code>@model IEnumerable<Sandbox.Models.Person>

<h2>Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>

@using (Ajax.BeginForm("Filter", "Person", new AjaxOptions { 
    HttpMethod = "Get", UpdateTargetId = "SearchResults", InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace }))
{
    @Html.DropDownList("filterName", new SelectList(ViewBag.Names), "Select a name", new   { onchange = "this.form.submit()" })
}

@Html.Partial("_PersonsTable")
</code>

Teilansicht

<code>@model IEnumerable<Sandbox.Models.Person>

<table id="SearchResults">
    <tr>
        <th>
            Name
        </th>
        <th>
            Age
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Age)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id=item.ID }) |
            @Html.ActionLink("Details", "Details", new { id=item.ID }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.ID })
        </td>
    </tr>
}
</table>
</code>

Warum wird meine searchResults-Tabelle nicht als Teilansicht gerendert?

Ich habe diese Skripte in meiner _Layout-Ansicht:

<code><script src="/Scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script src="/Scripts/modernizr-1.7.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftAjax.debug.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcAjax.debug.js" type="text/javascript"></script>
</code>

Antworten auf die Frage(2)

Ihre Antwort auf die Frage