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管窥这个样子的

所以。如何在局部视图调用后采取行动，等待响应，并显示在同一视图响应...

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