Javascript 单击返回DataTable行值

在过去的两周里，我一直在不断地学习和使用数据表，现在我已经到了一个困难的地步。我试图解决的问题是，当单击某一行的按钮时，如何在该行中传递值。目前，我对DataTables和JQuery的了解有限，当我在不同的行中有2到3个按钮并单击每个按钮时，它们返回的值仅为第一行中的值。我不知道如何最好地解决这个问题，或者我的错误可能在哪里。任何指导或帮助都将不胜感激。谢谢

<script type="text/javascript" charset="utf-8">

<!-- ------------------- Extract all Alerts ---------------------- -->
    $(document).ready(function (){
        var alertTable = $('#alert-table').DataTable({
            "jQueryUI": true,
            "columns": [
                { "data": "source", "visible": false },
                { "data": "host" },
                { "data": "description" },
                { "data": "priority" },
                { "data": "acknowledged", render: function( data, type, row ) {
                    if (data == "0" && row.priority > "2") {return '<div><form method="post" id="'+row.source + row.eventid+'" action="include/db_conn.php"> <input type="hidden"  id="evtid" value ="'+row.eventid+'"> <input type="hidden"  name="source" value ="'+row.source+'"> <INPUT TYPE="text" name="username" size="3" maxlength="3"> <input type="submit" name="'+row.source + row.eventid+'" onClick="ackbutton(this)" value="Ack Alert"></form></div>';
                    } return data;
                    }
                }
            ],
        });

        setInterval (function(){
            $.getJSON("data/json_data.txt", function (pcheckdata){

                alertTable.clear().draw();
                alertTable.rows.add(pcheckdata.alert).draw();
                alertTable.columns.adjust().draw();
            });
        }, 10000);
    });

        function ackbutton() {
            //e.preventDefault();
            var $this = $(this);
            var getvalues = $('#evtid').val();
            alert(getvalues);
        }
</script>

---

您需要在当前单击的确认按钮的最近div中找到id为“evtid”的输入

例如：

$(document).on('click','.submitButton',function(e){
e.preventDefault();
        debugger
          var $this = $(this);
        var curEventId = $this.closest('div').find('#evtid');
        var getvalues = curEventId.val();
        alert(getvalues);
 return false;

});

您也可以使用最近的形式而不是div

var curEventId=$this.closest'form'。查找'evtid'

---

你好，SSA，感谢您的回复。我会尝试一下，但我只是注意到，即使在数据刷新后，也不会检测到数据更改。这是工作，所以不知道我做了什么，以停止它的工作，因为我看到在您的代码，你做清除表，并重新绘制它与新的数据，这应该工作良好，直到有一个错误在浏览器控制台。检查控制台错误。F12。验证正在进行的操作的最佳方法是在render函数中以及清除和重画表的函数周围设置一个断点。您好，奇怪的是，刷新问题是我的浏览器缓存。清除它并开始更新-奇怪。我尝试了这两种建议，但得到了未定义的结果您能显示生成的html吗？或者从中创建一个简短的fiddler示例。对不起，SSA，如何使用外部JSON数据创建Fiddle？我已经在case中添加了html和json。谢谢

{
    "alert": [
        {
            "source": "Server1",
            "host": "host1",
            "description": "Engine Alive",
            "priority": "4",
            "triggerid": "14531",
            "acknowledged": "0",
            "eventid": "3419709",
            "value": "1"
        },
        {
            "source": "Server2",
            "host": "host2",
            "description": "webapp down",
            "priority": "2",
            "triggerid": "18027",
            "acknowledged": "1",
            "eventid": "4012210",
            "value": "1"
        }
    ],

    "error": []
}

$(document).on('click','.submitButton',function(e){
e.preventDefault();
        debugger
          var $this = $(this);
        var curEventId = $this.closest('div').find('#evtid');
        var getvalues = curEventId.val();
        alert(getvalues);
 return false;

});