Javascript 将行数据从DataTable发布到Ajax表单

我有一组使用datatables显示的JSON数据。在其中一列中，仅当该列和另一列中的值满足特定条件时，我才添加按钮和文本框。这是我用来做这件事的代码：

    $(document).ready(function (){
        var alertTable = $('#alert-table').DataTable({
            "jQueryUI": true,
            "order": [ 3, 'desc' ],
            "columns": [
                { "data": "source", "visible": false },
                { "data": "host" },
                { "data": "priority" },
                { "data": "ack", "render": function( data, type, row ) {
                    if (row.ack == "0" && row.priority > "2") {
                        return '<form><input class="ackname" type="text" value="Enter your name"><input class="ackbutton" type="button" value="Ack Alert" onclick="<get all items for that row and POST to a URL>"></form>';
                        }
                        return data;
                    }
                },
            ],
            "language": {
                "emptyTable": "No Alerts Available in Table"
            }
        });
    });

$（文档）.ready（函数（）{
var alertTable=$（“#alert table”）.DataTable({
“jQueryUI”：没错，
“订单”：[3，‘描述’]，
“栏目”：[
{“数据”：“源”，“可见”：false}，
{“数据”：“主机”}，
{“数据”：“优先级”}，
{“数据”：“确认”、“呈现”：函数（数据、类型、行）{
如果（row.ack==“0”和&row.priority>“2”）{
返回“”；
}
返回数据；
}
},
],
“语言”：{
“emptyTable”：“表中没有可用的警报”
}
});
});

---

通过在单元格中添加按钮和文本，可以很好地执行此操作。我希望实现的是，当单击任何按钮时，它应该将该行的所有值（包括在文本框中键入的内容）发布到URL，该URL具有另一个功能，该功能将提取这些详细信息并更新数据库并发送回刷新的数据。我是datatables和jquery的新手，任何指南都将不胜感激。

对代码做了一些更改，而不是使用div

$(document).ready(function (){
    var alertTable = $('#alert-table').DataTable({
        "jQueryUI": true,
        "order": [ 3, 'desc' ],
        "columns": [
            { "data": "source", "visible": false },
            { "data": "host" },
            { "data": "priority" },
            { "data": "ack", "render": function( data, type, row ) {
                if (row.ack == "0" && row.priority > "2") {
                    return '<div><input class="ackname" type="text" value="Enter your name"><input class="ackbutton" type="button" value="Ack Alert"></div>';
                    }
                    return data;
                }
            },
        ],
        "language": {
            "emptyTable": "No Alerts Available in Table"
        }
    });
    $(document).on("click",".ackbutton",function() {
        var currentIndex = $(this).parent().parent().index();
        var rowData = alertTable.row( index ).data();

        //extract the textbox value
        var TextboxValue = $(this).siblings(".ackname").val();
        var objToSave = {}; //Create the object as per the requirement
        //Add the textbox value also to same object and send to server
        objToSave["TextValue"] = TextboxValue;
        $.ajax({
              url: "url to another page"
              data: JSON.stringify({dataForSave : objToSave}),
              type: "POST",dataType: "json",
              contentType: "application/json; charset=utf-8",                 
              success: function(datas) {
                  //Your success Code
              },
              error: function(error) {
                  alert(error.responseText);
              }
          });
    });
});

$（文档）.ready（函数（）{
var alertTable=$（“#alert table”）.DataTable({
“jQueryUI”：没错，
“订单”：[3，‘描述’]，
“栏目”：[
{“数据”：“源”，“可见”：false}，
{“数据”：“主机”}，
{“数据”：“优先级”}，
{“数据”：“确认”、“呈现”：函数（数据、类型、行）{
如果（row.ack==“0”和&row.priority>“2”）{
返回“”；
}
返回数据；
}
},
],
“语言”：{
“emptyTable”：“表中没有可用的警报”
}
});
$（文档）。在（“单击“，”.ackbutton”，函数（）上{
var currentIndex=$（this.parent（）.parent（）.index（）；
var rowData=alertTable.row（index.data（）；
//提取文本框值
var TextboxValue=$（this.sillides（“.ackname”）.val（）；
var objToSave={}；//根据需求创建对象
//将文本框值也添加到同一对象并发送到服务器
objToSave[“TextValue”]=TextboxValue；
$.ajax({
url:“指向其他页面的url”
data:JSON.stringify（{dataForSave:objToSave}），
类型：“POST”，数据类型：“json”，
contentType:“应用程序/json；字符集=utf-8”，
成功：功能（数据）{
//你的成功代码
},
错误：函数（错误）{
警报（error.responseText）；
}
});
});
});

由于这两个页面都在同一个项目中，所以您也可以使用单个ajax来完成，一次将所有值传递给服务器，然后从服务器内部调用另一个页面，并使用查询字符串传递值

这不是一个正在运行的代码，而是给您一个如何继续的基本想法

---

希望这有帮助：）

如果您指定的url是同一个项目的url，那么可以使用2个ajax请求完成此操作，1个在另一个内。首先，使用其类定义按钮的按钮点击。然后使用

$（this）.parent（）.parent（）

查找行项目，这将为您提供行。然后使用

$.ajax

可以发布记录，即URL是同一项目的。顺便问一下，是否有任何datatable示例可供我学习作为指导？另外，由于文本框不是表格的一部分，我如何在文本框中获取值呢？不，亲爱的，我没有这样的链接。但是，在单击事件中，您可以使用

oTable.fngedata（）

获取所有行的数据，或者使用

oTable.row（index.data（）

获取特定索引的数据。然后您可以使用通常的ajax调用来保存数据。谢谢@D.T。我将使用行索引。这是一种很好的方法。我会调整它，看看它如何发展。非常感谢，亲爱的：），但请告诉我哪种方法是成功的，一旦你完成了，或者你是否遵循了任何其他方法，我一定会的。顺便说一句，第二个ajax的目的是什么？请纠正我，如果我错了，你想在一个页面中保存数据，同时重定向到另一个页面（url），并使用单独的函数保存数据。记住这一点，我将其作为第一个ajax保存在当前页面中，第二个保存在另一个url中。但如果您将所有数据传输到服务器，并在需要时重定向到其他页面，这将很容易。我所做的只是将行值传递到URL。此URL将使用这些值并处理更新。当更新完成时，它将响应我的代码说OK，然后我将刷新表，以便显示新的更新。它所做的只是将DB值从0更改为1，以确认警报已被确认