ASP.Net MVC無負載刪除整個頁面

我還是新來的asp.net mvc，我想刪除部分視圖列表，刪除正在工作，但我必須重新加載整個頁面以顯示新列表ASP.Net MVC無負載刪除整個頁面

我要的是局部視圖顯示後刪除新的列表，而無需加載整個頁面，因此只有部分視圖更新

這裏是我的代碼：

我的觀點內容的一些局部視圖：

@model cc.Models.User 

@{ 
    Layout = "~/Views/Shared/_MemberLayout.cshtml"; 
}  

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/MicrosoftMvcValidation.debug.js")" type="text/javascript"></script> 

<body class="container body-content"> 

<div id="partialView1"> 
    @Html.Action(...) 
</div> 

<div id="partialView2"> 
    @Html.Action(...) 
</div> 

<div id="partialView4"> 
    @Html.Action(...) 
</div> 

<div id="partialView3" class="col-md-8 col-sm-1"> 
    @Html.Action("UserHistory", "User") 
</div> 


</body>

這是我對UserHistory的局部視圖我試圖使用ajax，但它不工作。我已經嘗試過使用

$(this).closest('.historyRow').remove();

和

$("a.deleteHistory").live("click", function() { 
    $(this).parents("div.historyRow:first").remove(); 
    return false; 
});

這裏是我的代碼：

@model cc.Models.UserHistory 

@{  
    Layout = null; 
} 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/MicrosoftMvcValidation.debug.js")" type="text/javascript"></script> 


<div id="formHistory"> 
    <div id="historyDetail"> 
     <div id="editDataHistoryUser"> 
      @foreach (var item in Model.History) 
      { 
       @Html.Partial("UserHistoryDetail", item) 
      } 
     </div> 
     @Html.ActionLink("Add Form", "AddUserHistory", null, new { id = "btnFormHistory" }) 
    </div> 
</div> 



<script type="text/javascript"> 



$("#btnFormHistory").click(function() { 
    $.ajax({ 
     url: this.href, 
     cache: false, 
     success: function (html) { $("#editDataHistoryUser").append(html); } 
    }); 
    return false; 
}); 

$('#formHistory').on('click', '.deleteHistory', function() { 
    var id = $(this).data('id'); 
    if (id == 0) { 

     $(this).closest('.historyRow').remove(); 

     //$("a.deleteHistory").live("click", function() { 
     // $(this).parents("div.historyRow:first").remove(); 
     // return false; 
     //}); 
    } else { 

     var url = '@Url.Action("DeleteUserHistory", "User")'; 
     $.post(url, { ID: id }, function (response) { 
      if (response) {      
       $(this).closest('.historyRow').remove(); 

       //$("a.deleteHistory").live("click", function() { 
       // $(this).parents("div.historyRow:first").remove(); 
       // return false; 
       //});     

      } 
     }).fail(function (response) { 

     }); 
    } 
}); 

</script>

這是我UserHistoryDetail代碼：

@model cc.Models.IUserHistory 

@{ 
    Layout = null; 
} 


<div id="formUserHistoryDetail"> 
    @using (Ajax.BeginForm("UserHistoryDetail", "User", new AjaxOptions { HttpMethod = "POST" })) 
    { 
    <div id="historyRow"> 
     <div>@Html.LabelFor(model => model.IDHistory, new { style = "display:none;" })</div> 
... 
     <a href="#" class="deleteHistory" data-id="@Model.IDHistory">delete</a> 
        </div> 


       } 

</div>

這裏是我的JsonResult當按鈕刪除點擊：

[HttpPost] 
    public JsonResult DeleteUserHistory(string ID) 
    { 

     db.delUserHistory(ID); 

     return Json(true); 
    }

我仍然找不到解決方案，或者我可能以錯誤的方式使用ajax，任何建議？

來源

2017-04-22 Pramana

如果您使用的是MVC4（或更高版本），則不需要這些[古代腳本引用]（http://stackoverflow.com/questions/8782697/are-microsoftajax-js-microsoftmvcajax-js-and-microsoftmvcvalidation -js過時）。 –

您的操作'DeleteUserHistory'可以返回更新的歷史列表，而不是布爾值，您可以重新綁定ajax成功的結果。 – Anil

讓我們假設DeleteUserHistory帖子的網址爲「/ [控制器] /」：「/ UserHistory」

$('.deleteHistory').click(function(){ 
    var url = '/UserHistory'; 
    $.ajax({ 
    type: "POST", 
    url: url, 
    data: data, 
    success: onSuccessCallback 
    }); 
});

什麼你應該做的是使用的WebAPI來管理數據，並使用視圖來顯示。

至於刪除，使用方法類型'刪除'而不是'後'。帖子應該用於「增加」。

來源

2017-04-23 02:36:27 user7886649

ASP.Net MVC無負載刪除整個頁面

回答

相關問題