从ajax模态onclick获取价值

时间:2017-12-29 03:05:30

标签: javascript ajax modal-dialog

我试图在使用Ajax调用的模式中获取行id的值。

我想从模态中获取行id(data-id)。

JavaScript函数“onRowClick”适用于主页面中的表格,但不适用于模态中的表格。

http://plnkr.co/edit/ehkd8L22KZb0xxCnubUb?p=preview

<DOCTYPE html>
 <html>
  <head>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/modalit@0.1.6/dist/MODALit.css">
  <script src="https://cdn.jsdelivr.net/npm/modalit@0.1.6/dist/MODALit.min.js"></script>
</head>

<body>
<table id="table1">
    <tr data-id="1"><td>Row 1</td></tr>
    <tr data-id="2"><td>Row 2</td></tr>
    <tr data-id="3"><td>Row 3</td></tr>
</table>
<hr />
<div style="color:green" id="row-value">-</div>
<hr />
<!-- Sets modal target -->
<button type="button" id="button" data-src="modal.html">Modal Open</button>
<script>
    var modal = new MODALit({
        el: '#button',
    });

    window.onload = onRowClick("table1", function (row) {
        var rowid = row.getAttribute("data-id")
        //alert(rowid);
        document.getElementById("row-value").innerHTML = rowid;
    })

    function onRowClick(tableId, callback) {
        var table = document.getElementById("table1"),
            rows = table.getElementsByTagName("tr"),
            i;
        for (i = 0; i < rows.length; i++) {
            table.rows[i].onclick = function (row) {
                return function () {
                    callback(row);
                };
            }(table.rows[i]);
        }
    };

</script>

</body>

</html>

Ajax内容(modal.html):

<table id="table2">
 <tr data-id="1"><td>Row 1</td></tr>
 <tr data-id="2"><td>Row 2</td></tr>
 <tr data-id="3"><td>Row 3</td></tr>
</table>

<script>
     window.onload = onRowClick("table2", function (row) {
        var rowid = row.getAttribute("data-id")
        //alert(rowid);
        document.getElementById("row-value").innerHTML = rowid;
    })

    function onRowClick(tableId, callback) {
        var table = document.getElementById("table2"),
            rows = table.getElementsByTagName("tr"),
            i;
        for (i = 0; i < rows.length; i++) {
            table.rows[i].onclick = function (row) {
                return function () {
                    callback(row);
                };
            }(table.rows[i]);
        }
    };

http://plnkr.co/edit/ehkd8L22KZb0xxCnubUb?p=preview

如何获取模态中行的数据ID?

0 个答案:

没有答案