Question

我的剃刀页面上有一个表单和一个局部视图，这个想法是，如果我更改下拉列表，Controller会做一些工作并设置一个ViewBag.ShowAlert（bool）来触发显示的局部视图。 / p>

虽然这样做有效，但局部视图不是仅在局部视图中显示代码，而是显示为新视图而不是同一视图。

知道为什么吗？

视图如下所示

@using (Html.BeginForm("AlterVote", "ChangeVoteType"))  
{
@Html.AntiForgeryToken()

<div class="form-horizontal">
    <h1>New voting preference</h1>
    <hr />

    <p>Please select the type of vote you wish to change to @Html.DropDownListFor(model=>model.SelectedType, ViewBag.myList as SelectList, "Voting type", new { onchange = "this.form.submit();"})</p>

    <div id="partialDiv">
        @if (ViewBag.ShowAlert)
        {
            @Html.Partial("VotingChange")
        }
    </div>
</div>
}

处理HttpPost的控制器就是这个

[HttpPost]
    public PartialViewResult AlterVote(Dropdown dropType)
    {
        ChangeBoilerPlate(dropType.SelectedType);
        dropType.CurrentType = VoteTypeNames[(int)HomeController.VoterModel.CurrentVoteType];
        return PartialView("VotingChange", dropType);
    }

我猜这是由于初始视图是一个表单，所以部分对于插入视图的位置感到困惑。

Answer 1

如果我理解正确，the partial view shows as a new view你的意思是它带有html标记，body以及完整的布局。要解决此问题，您需要在部分视图中将布局设置为null，如下所示：

@model YourNamespace.Dropdown

@{
    Layout = null;
}

<!-- partial view html below -->
<div>
</div>

div标签只是为了说明。

虽然这可能会解决您的问题，但您可能希望加载局部视图而无需再次重新加载整个页面。这可以使用ajax，如下所示：

主视图

@using (Html.BeginForm("AlterVote", "ChangeVoteType"))  
{
@Html.AntiForgeryToken()

<div class="form-horizontal">
    <h1>New voting preference</h1>
    <hr />

    <p>Please select the type of vote you wish to change to @Html.DropDownListFor(model=>model.SelectedType, ViewBag.myList as SelectList, "Voting type", new { id = "vote"})</p>

    <div id="partialDiv">
    </div>
</div>
}

<script type="text/javascript">
  $(document).ready(function () {
    $('#vote').change(function() {
        var selectedType = $(this).val();
        $.post('yourserver/YourController/AlterVote', { "SelectedType": selectedType })
        .done(function (data) {
            $('#partialDiv').html(data);
        })
        .fail(function () {
            console.log('Whoops, something went wrong!!!');
        });
    });
  });
</script>

所以我刚刚添加了一个javascript来监听你的dropdrown上的同一个更改事件，但是我没有提交表单，而是使用ajax加载部分视图html而不重新加载整个页面。

只需修复网址，并记住在部分视图中将布局设置为null。此外，您可能希望将此javascript放在单独的文件中，从而使用捆绑包加载它。

PartialView重定向而不是插入

1 个答案: