Question

过去两周我一直在和DataTables一起学习和无休止地工作，现在又开始了。我试图解决的问题是，当单击该行的按钮时，我可以如何传递特定行中的值。由于我对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>

HTML：

<body>
    <div class="all_tables">
        <table id="alert-table" class="display" cellspacing="0">
            <thead class="t-headers">
                <tr>
                    <th>Server</th>
                    <th>Host</th>
                    <th>Description</th>
                    <th>Priority</th>
                    <th>Acknowledged</th>
                    <th>Eventid</th>
                </tr>
            </thead>
        </table>
    </div>
</body>

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": []
}

Answer 1

您需要在当前点击的确认按钮的最近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'）。find（'＃evtid'）;

返回DataClick行值onClick

1 个答案: