Question

我想在用户更改下拉列表的当前值时更新部分视图。

使用onchange submit，部分视图不会加载div，而是替换整个页面。我该如何解决？

视图：

@using (Ajax.BeginForm("GetEnvironment", new RouteValueDictionary { { "Environment", Model.Environnements } }, new AjaxOptions() { UpdateTargetId = "ExportDiv" }))
{
    @Html.DropDownListForEnum(x => x.Environnements, new { onchange = "this.form.submit();" })
}

    <div id="ExportDiv">
        @Html.Partial("Export")
    </div>

控制器：

    public PartialViewResult GetEnvironment(ExampleDto model)
    {
        return PartialView("Export", model);
    }

Export.cshtml

Answer 1

看起来像triggering submit on the form causes whole page to be posted而不是AJAX行为。试试这个：

@using (Ajax.BeginForm("GetEnvironment", new RouteValueDictionary { { "Environment", Model.Environnements } }, new AjaxOptions() { UpdateTargetId = "ExportDiv" },new {id = "ajaxForm"))
{
    @Html.DropDownListForEnum(x => x.Environnements, new { onchange = "submitAjaxForm()" })
}

<div id="ExportDiv">
    @Html.Partial("Export")
</div>

<script type="text/javascript">
    $('form#ajaxForm').submit(function(event) { 
        eval($(this).attr('onsubmit')); return false; 
    });

    window.submitAjaxForm = function(){
        $('form#ajaxForm').submit();
    }
</script>

如果您正在使用脚本，则需要在自己的部分中包含这些脚本。

Answer 2

结果应该与Ufuk建议的结果相同，但您是否尝试在 this.form.submit（）; 之后添加 return false; ？

MVC更新部分视图onchange下拉列表

2 个答案: