Asp.net mvc 删除行后刷新Jquery数据表

Asp.net mvc 删除行后刷新Jquery数据表,asp.net-mvc,datatables,asp.net-ajax,Asp.net Mvc,Datatables,Asp.net Ajax,我有一个Datatable,它显示来自表(角色)的数据,我使用ajax调用删除一行: function OnDeleteClick(el) { //var url = ($(this).attr('href')); //alert(url); //var employeeId = event.getAttribute(id); //e.target.id //var url = ($(this).attr('id'));

我有一个Datatable,它显示来自表(角色)的数据,我使用ajax调用删除一行:

 function OnDeleteClick(el) 
    {
        //var url = ($(this).attr('href'));
        //alert(url);
        //var employeeId = event.getAttribute(id); //e.target.id
        //var url = ($(this).attr('id'));      
        var id = $(el).attr('id');       
        var roleid = getURLParameter(id, 'id');        
        var username = getURLParameter(id, 'name');        
        var flag = confirm('You are about to delete Role ' + username + ' permanently.Are you sure you want to delete this record?');

        if (flag) { 
            $.ajax({ 
                url: '/Role/DeleteAJAX', 
                type: 'POST', 
                data: { roleId: roleid },
                dataType: 'json', 
                //success: function (result) { alert(result); $("#" + Name).parent().parent().remove(); },
                success: function (result) {
                    alert(result); 
                },
                error: function () { alert('Error!'); } 
            }); 
        } 
        return false; 
    }
我的问题是,一旦删除成功,如何刷新jquery datatable,这样被删除的行也将从datatable中删除

下面是我用来构建JQuery数据表的代码:

<div class="row" >
    <fieldset class="col-md-10 col-md-offset-1" >
        <legend>Liste des rôles </legend>
        <div class="table-responsive" style="overflow-x: hidden;">
            <table width="98%" class="table table-bordered table-hover" id="dataTables-example">
                <thead>
                    <tr>
                        <th>Designation Role</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var item in Model)
                    {
                        <tr>
                            <td>
                                @item.Name
                            </td>
                            <td width="110">                                
                                <a class="btn btn-custom btn-xs" href="" onclick="return getbyID('@item.Id',false)" title="consulter">
                                    <i class="fa fa-folder-open-o"></i>
                                </a>
                                <a class="btn btn-custom btn-xs" href="" onclick="return getbyID('@item.Id',true)" title="Editer">
                                    <i class="fa fa-edit"></i>
                                </a>
                                <a class="btn btn-custom btn-xs" onclick="OnDeleteClick(this);" id="#?id=@item.Id&name=@item.Name" title=" supprimer">
                                    <i class="fa fa-trash-o"></i>
                                </a>
                            </td>
                        </tr>
                    }
                </tbody>
            </table>
        </div>
        <div class="b-right">
            <button type="button" class="btn btn-primary" onclick="location.href='@Url.Action("Create", "Role")'">
                <i class="fa fa-plus"></i> Ajouter un role
            </button>
        </div>        
    </fieldset>
</div>

雷莱斯酒店
指定角色
@foreach(模型中的var项目)
{
@项目名称
}
阿琼角色
感谢您的帮助。

如果您正在使用并使用AJAX数据源构建了如下表:

var myTable = $("#myTable").DataTable({ ajax: "path/to/my/data" });
您可以按如下方式刷新表中的数据:

$.ajax({ 
    <your deleting code>
    success: function() {
        myTable.ajax.reload();
    })
});
$.ajax({
成功:函数(){
myTable.ajax.reload();
})
});
如果您使用MVC中的视图模型使用Razor构建了表,则需要1)在成功回调中重新加载页面:

$.ajax({ 
    <your deleting code>
    success: function() {
        window.location.reload();
    })
});
$.ajax({
成功:函数(){
window.location.reload();
})
});
或者2)从DOM中删除该行,知道该行已从数据库中删除,以保持DB和UI同步:

$.ajax({ 
    <your deleting code>
    success: function() {
        myTable.row($(el).parents("tr")).remove().draw();
    })
});
$.ajax({
成功:函数(){
行($(el).parents(“tr”)).remove().draw();
})
});

这是一个HTML表,您正在使用jquery吗?或者您正在使用DataTables?这是一个Jquery DataTables,而不是一个简单的html表。您能展示一下如何构建表的代码吗?谢谢Joe的回复,但实际上我并没有像您的帖子中那样构建datatable,而是使用一个简单的asp.net mvc视图。那么在本例中,我如何刷新数据表呢?我已经用3个选项更新了答案,用于XHR刷新、页面重新加载或DOM操作以删除行。