Jquery 正在尝试将Ajax请求添加到Datatable

Jquery 正在尝试将Ajax请求添加到Datatable,jquery,datatables,Jquery,Datatables,我正在尝试向我的表中添加一些功能,允许用户选择一行或多行,以便在用户单击delete按钮后,它将向服务器发送Ajax请求,从表中删除项目。我一直在看datatables网站,这是我添加到我的页面的脚本,有太多我不确定我到底需要什么来完成这个 $( '#table' ).dataTable({ "sDom": '<"top"lTf<"clear">>rt<"actions"<"actions-left"i><"actions-right"p&

我正在尝试向我的表中添加一些功能,允许用户选择一行或多行,以便在用户单击delete按钮后,它将向服务器发送Ajax请求,从表中删除项目。我一直在看datatables网站,这是我添加到我的页面的脚本,有太多我不确定我到底需要什么来完成这个

$( '#table' ).dataTable({
    "sDom": '<"top"lTf<"clear">>rt<"actions"<"actions-left"i><"actions-right"p>>',
    "bAutoWidth": false,
    "sPaginationType" : "full_numbers",
    "oTableTools": {
    "aButtons": [
            {
                "sExtends":    "text",
                "sButtonText": "Add"
            },
            {
                "sExtends":    "text",
                "sButtonText": "Edit"
            },
            {
                "sExtends":    "text",
                "sButtonText": "Delete",
                "sAjaxUrl": "delete_title"
            },
        ]
    },
    "aoColumnDefs": [
        { "bSortable": false, "aTargets": [ 0 ] },
        { "sWidth": "20px", "aTargets": [ 0 ] },
        { "sWidth": "40px", "aTargets": [ 1 ] },
        { "sClass": "alignCenter", "aTargets": [ 1 ] }
    ]
});

<?php            
        $tmpl = array ( 'table_open'  => '<table class="table" id="titles-table">' );
        $data = array('name' => 'titles', 'class' => 'selectall');
        $this->table->set_heading(form_checkbox($data), 'ID', 'Title Name', 'Style', 'Status');            
        $this->table->set_template($tmpl);             
        foreach ($titles as $row)
        {
            $checkbox_data = array(
                'name'        => 'titles',
                'id'          => $row->id
            );
            $this->table->add_row(form_checkbox($checkbox_data), $row->id, $row->title_name, $row->type_name, $row->status_name);
        }
        echo $this->table->generate(); 
        ?>
还有人看到我遗漏了什么吗?

检查示例

您需要将sAjaxSource添加到数据表初始化中,并在其中定义删除。此外,您可能需要将额外的服务器参数推送到服务器端。您可以使用以下内容:

//Example from one of my projects:
//This adds extra data to the ajax request sent by datatables. 
"fnServerParams": function (aoData) {
        aoData.push({ "name": "bu", "value": BU });
        aoData.push({ "name": "SLAName", "value": SLANAME });
        aoData.push({ "name": "substep", "value": STEP });
        aoData.push({ "name": "timeperiod", "value": TIME });
        var UserFilter = $("#userFilter").val();
        aoData.push({ "name": "user", "value": UserFilter });
    }
如果你需要更多的帮助或更多的细节,尽管问吧

//编辑1

$( '#table' ).dataTable({
"sDom": '<"top"lTf<"clear">>rt<"actions"<"actions-left"i><"actions-right"p>>',
"bAutoWidth": false,
"sPaginationType" : "full_numbers",
"sAjaxSource" : "/path/to/function",
"fnServerParams": function (aoData) {
    aoData.Push(ArrayWithCheckboxInfo);
},
"oTableTools": {
"aButtons": [
        {
            "sExtends":    "text",
            "sButtonText": "Add"
        },
        {
            "sExtends":    "text",
            "sButtonText": "Edit"
        },
        {
            "sExtends":    "text",
            "sButtonText": "Delete",
            "sAjaxUrl": "delete_title"
        },
    ]
},
"aoColumnDefs": [
    { "bSortable": false, "aTargets": [ 0 ] },
    { "sWidth": "20px", "aTargets": [ 0 ] },
    { "sWidth": "40px", "aTargets": [ 1 ] },
    { "sClass": "alignCenter", "aTargets": [ 1 ] }
]
})


然后在服务器端,根据来自阵列的信息处理复选框。我不知道您是想从datatable还是数据库中删除该行,但您可以同时执行这两项操作,然后它会将更新后的数据发送到客户端。

另一种方法是简单地使用jquery/javascript来完成您的请求。。这是我为一件非常相似的事情所做的一个例子,它不是对你事业的直接回答。。但是如果修改为与你的身份证等级相匹配,等等。。能为你的事业做很多事

        $("#hideme").click(function(e)
        {
            e.preventDefault();
            var postArray = new Array();
            i=0;
            $("input:checked").each(function()
            {
                var theID = $(this).attr("name");
                theID = theID.replace("offerterms-", "");
                postArray.push(theID);
                $(this).parents("tr").animate(
                    {"color":"#FFF", "background-color":"#FFF"},
                    "5000",
                    function()
                    {
                        $("input:checked").parents("tr").remove();
                        $("table.datatable TR").removeClass("darkrow");
                        $("table.datatable TR:odd").addClass("darkrow");
                    });
            });
            $.post("./hide/", {"entry":postArray}, function(data)
            {
                if((".datatable tr").length == 1){$(".datatable").hide();$("#hideme").hide();$("#recordCount").text("0");}
                else{$("#recordCount").text((parseInt($("#recordCount").text())-1));}
                //alert(data.msg);
            }, "json");
        });

这实际上是在表上进行迭代,并构建一个复选框数组以发布到我的后端,此时我使用该数组来处理我的db条目,并在我的情况下隐藏数据,以便在另一个类似的表上使用,管理员可以查看并稍后取消隐藏这些数据。。无论如何,当在表上迭代时,它会在每行的基础上隐藏所有选中复选框的行。

唯一的问题是,在单击“删除”按钮之前选中复选框时,它将是复选框的值。我不知道您将有多少个复选框,但您可以按一个包含这些值的数组和所有复选框的索引。你能更新你的答案吗,因为我不了解主要发生了什么,以及它将如何应用到我的代码中。我将从复选框中的何处创建值数组。我不应该将sAjaxSource和参数移到delete按钮,因为我只希望在单击“删除”按钮。