PartialView不在视野范围内

Question

我有PartialView的问题，在调用一些动作后，返回视图渲染出视图，就像另一个视图..

HTML PartialView

<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>

但是El Partial View看起来像这样

因此。部分视图如何在同一视图中调用post action，wait response和show response ...

Answer 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");
                }
            });
        });
    });