MVCのポストアクションからポストがどこから来たブートストラップポップアップモーダルの部分ビューにリダイレクトするのですか？

Question

MVCのポストアクションからポストがどこから来たブートストラップポップアップモーダルの部分ビューにリダイレクトするのですか？

ここには、ページのブートストラップモーダルポップアップにあるPartialViewがあります。 モデルのエラーを待っている検証タグ付きのdivがあります。

@model CreateRoleViewModel 

<div class="panel panel-primary partialModalFormDivs"> 
    @Html.Partial("_ModalHeader", 
     new ModalHeader 
     { 
      Heading = "ADD ROLE", 
      glyphiconClass = "glyphicon glyphicon-random" 
     } 
    ) 

    <div class="panel-body"> 
     <div asp-validation-summary="All" class="text-danger"></div> 
     <form asp-action="CreateRole" method="post"> 
      <div class="form-group"> 
       <label asp-for="RoleName"></label> 
       <input asp-for="RoleName" class="form form-control" /> 
      </div> 
      <div class="modal-footer"> 
       <button type="submit" class="btn btn-primary">Create</button> 
       <a asp-action="Index" class="btn btn-default">Cancel</a> 
      </div> 
     </form> 
    </div> 
</div> 

それは、このアクションにポスト：

[HttpPost] 
    public async Task<IActionResult> CreateRole(CreateRoleViewModel createRoleViewModel) 
    { 
     if (ModelState.IsValid) 
     { 
      IdentityRole role = new IdentityRole(createRoleViewModel.RoleName); 

      IdentityResult result 
       = await _roleManager.CreateAsync(role); 

      if (result.Succeeded) 
      { 
       return RedirectToAction("Index"); 
      } 
      else 
      { 
       foreach (IdentityError error in result.Errors) 
       { 
        ModelState.AddModelError("", error.Description); 
       } 
      } 
     } 
     return View(createRoleViewModel); 
    } 

私は最後に、このようなPartialViewを返すことができます。

return View("_CreateRole", createRoleViewModel); 

しかし、その後、ページ全体がクリアされ、この部分が返されますレイアウトファイルはありません。

結果をモーダルポップアップウィンドウに戻すにはどうすればよいですか。 問題と現在の動作を理解しています。しかし、誰かがこれを解決しましたか？

Answer 1

私はあなたがしたいことはajax投稿であり、部分的なビューを返してフォームを置き換えることだと思います。フォームは、コンテンツをajaxの投稿結果に置き換えるために使用されるidを持つコンテナdiv内にある必要があります。これを行うには、

<div class="panel-body"> 
    <div asp-validation-summary="All" class="text-danger"></div> 
    <div id="resultcontainer"> 
     <form asp-action="CreateRole" method="post" 
     data-ajax="true" 
     data-ajax-method="POST" 
     data-ajax-mode="replace" 
     data-ajax-update="#resultcontainer" 
     > 
      <div class="form-group"> 
       <label asp-for="RoleName"></label> 
       <input asp-for="RoleName" class="form form-control" /> 
      </div> 
      <div class="modal-footer"> 
       <button type="submit" class="btn btn-primary">Create</button> 
       <a asp-action="Index" class="btn btn-default">Cancel</a> 
      </div> 
     </form> 
    </div> 
</div> 

以下のように自動配線がAJAXフォーム上のデータ - *属性に基づいてますし、部分図

return PartialView(createRoleViewModel); 

に返すことを忘れないでください jquery unobtrusive ajaxスクリプトを含める必要があり