如何從視圖運行時刪除數據？

Question

我正在開發MVC應用程序並使用剃刀語法。

在這個應用程序中，我給評論設施。

我已經添加了一個局部視圖，它從數據庫中加載評論/記錄。

在下圖中，我們可以看到名爲run-time for employee index view的評論框。

問題是，當用戶刪除評論時，它會從數據庫中刪除，但如何將其從屏幕上刪除而不重定向到任何頁面？

我婉刪除刪除評論div標籤順利...

請參閱圖像...

我的代碼是...

@model IEnumerable<CRMEntities.Comment> 

@{ 


    <div class="ParentBlock"> 


    @foreach (var item in Model) 
    { 
     <div class="OwnerClass" id="OwnerName" data-comment-id="@item.Id"> 


     <span class="EmpName"> @Html.ActionLink(item.Owner.FullName, "Details", "EMployee", new { id = item.OwnerId }, new { @style = "color:#1A6690;" })</span> 

      @Html.DisplayFor(ModelItem => item.CommentDateTime) 

      <span class="EmpName"><button type="button" class="deleteComment">Delete</button></span> 



     <p class="CommentP"> 
      @Html.DisplayFor(ModelItem => item.CommentText) 
     </p> 

     <br /> 
      <a class="Delete222" style="cursor:move;display:none;">DeleteNew</a> 
     <br /> 

    </div> 

    } 


    <p class="p12"> 

     </p> 



</div> 

     <p id="ClassPara" class="ShowComments" onclick="chkToggle()">Show All Comments</p> 

} 


    @Html.TextArea("Comment", "", 5, 80, "asdsd") 


    <input type="button" value="Add Comment" id="AddCommentButton"/>       
    <input type="button" value="Clear" onclick="clearText()"/>      

    <br /> 


</body> 
</html> 



<script src="../../Scripts/jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".deleteComment").click(function() { 
      alert("asd"); 
      var commentBlock = $(this).parent('.OwnerClass'); 
      commentBlock.hide('slow') 

    }); 
    }); 


    $(document).ready(function() { 

     $('.OwnerClass').hover(function() { 
      $('.Delete222', this).show(); 
     }, function() { 
      $('.Delete222').hide(); 


     }); 

    }); 

</script> 

Answer 1

而不是生成動作鏈接，放置在那裏按鈕或。綁定JavaScript函數以點擊該按鈕上的事件，在此函數中使ajax調用操作，刪除db中的註釋並使用jquery隱藏正確的div。

<span class="EmpName"><button type="button" class="deleteComment">Delete</button></span> 

的JavaScript：

$('.deleteComment').click(function() 

     { 
      var commentBlock = $(this).parent('.ParentBlock'); 
      $.ajax({ 

       type: 'post', 
       url: '/Comment/DeleteComment', 
       dataType: 'json', 
       data: 
       { 

       commentId: getCommentId(commentBlock) 

       }, 
       success: function (data) { 

        commentBlock.hide('slow') 

       } 

      }); 
     }); 

UPDATE：

更新由於問題升級和這樣的回答下面的評論：

$(document).ready(function() { 
    $(".deleteComment").click(function() { 

     var commentBlock = $(this).parent('.OwnerClass'); 

     $.ajax({ 
      type: 'post', 
      url: '/Comment/DeleteComment', 
      dataType: 'json', 
      data: 
      { 

      commentId: commentBlock.attr('data-comment-id') 

      }, 
      success: function (data) { 

       commentBlock.hide('slow') 

      } 

     }); 

}); 
});