部分视图不可见答案

【问题标题】：PartialView out of view部分视图不可见
【发布时间】：2017-05-25 19:48:24
【问题描述】：

我的 PartialView 有问题，在调用某些操作后，返回视图呈现在视图之外，就像另一个视图一样..

HTML 部分视图

<form asp-action="SendFoo" asp-controller="Foo" method="post" enctype="multipart/form-data">
    <input type="file" name="files" />
    <input type="file" name="files" />
    <button type="submit">Send Foo</button>
</form>

API

[HttpPost]
public async Task<IActionResult> SendFoo(IList<IFormFile> files)
{
    //do something

    return PartialView("_FooSendData");
}

布局

<div class="container-fluid">
    <div id="partialViewContainer">
        @{Html.RenderPartial("_FooSendData"); }
    </div>
</div>

但是局部视图看起来像这样

所以。局部视图如何在同一个视图中调用发布操作、等待响应和显示响应...

【问题讨论】：

标签： c# asp.net-mvc asp.net-core

【解决方案1】：

您需要发布使用 Ajax 或 javascript 并更新 PartialView：

$('#MySubmitButtonId').live('click', function (event) {
    $.post(
        '@Url.Action("PostAction", "Post")', 
        { content: 'GetpostDetails' }, 
        function(result) {
            $('#MyPartialContainerId').html(result);
        }
    );
});

上传文件：

$(document).ready(function () {
        $("#Upload").click(function () {
            var formData = new FormData();
            var totalFiles = document.getElementById("FileUpload").files.length;
            for (var i = 0; i < totalFiles; i++)
            {
                var file = document.getElementById("FileUpload").files[i];

                formData.append("FileUpload", file);
            }
            $.ajax({
                type: "POST",
                url: '/Controller/Action',
                data: formData,
                dataType: 'json',
                contentType: false,
                processData: false,
                success: function (response) {
                     $('#MyPartialContainerId').html(response);
                },
                error: function (er) {
                    alert("er");
                }
            });
        });
    });

【讨论】：