Question

我有一个从SQL查询填充的表。我想让用户单击任何行并加载另一个html文件，或替换当前的html视图，该视图应基于用户单击的第n列值来运行另一个sql查询，因此它应填充页面。我停留在转移点击价值上

var arr1 = [''];
var arr2 = [''];
var arr3 = [''];
var arr4 = [''];

function loadNames() {
var dbConn = new sql.ConnectionPool(config);
dbConn.connect().then(function () {
    var request = new sql.Request(dbConn);
    request.query("SQL QUERY").then(function (recordSet) {
        for (var i = 0; i < recordSet.recordsets[0].length; i++) {
            arr1.push(recordSet.recordset[i].col1);
            arr2.push(recordSet.recordset[i].col2);
            arr3.push(recordSet.recordset[i].col3);
            arr4.push(recordSet.recordset[i].col4);
        }
        $('#table').find('thead tr').append('<th>colName1</th>')
        $('#table').find('thead tr').append('<th>colName2</th>')
        $('#table').find('thead tr').append('<th>colName3</th>')
        $('#table').find('thead tr').append('<th>colName4</th>')
        for (var i = 0; i < arr1.length; i++) {
            $('#table').find('tbody').append('<tr><td>'+ arr1[i] +'</td>'+'<td>'+ arr2[i] +'</td>'+'<td>'+ arr3[i] +'</td>'+'<td>'+ arr4[i] +'</td></tr>')
        }
        dbConn.close();
    }).catch(function (err) {
        console.log(err);
        dbConn.close();
    });
}).catch(function (err) {
    console.log(err);
});
}

这填充没有问题，而且我知道如何填充其他表（如果我能以某种方式传递将在SQL查询中成为WHERE子句的值）

更新：

让我们假设用户单击了第9行，单击后它应该显示另一个html文件并传递arr1 [8]的文本值，以便我可以在另一个sql查询或同一html文件中使用它，我需要删除所有表数据，重新运行sql查询并再次填充表格。我只是不知道如何传递数据

Answer 1

如果您只对单击时获得行索引感兴趣，则只需更改添加行的代码即可注册onClick处理程序：

for (var i = 0; i < arr1.length; i++) {
    $('#table').find('tbody').append('<tr onclick="getRow(this);"><td>'+ arr1[i] +'</td>'+'<td>'+ arr2[i] +'</td>'+'<td>'+ arr3[i] +'</td>'+'<td>'+ arr4[i] +'</td></tr>')
}

并添加指定的功能：

function getRow(element) {
    // handle the data and refresh in doStuff
    doStuff(arr1[element.rowIndex]);
}

如果要获取列和行，则需要在td元素中添加this函数：

function getColumnAndRow(element) {
    // handle the data and refresh in doStuff
    // doStuff(row, column)
    doStuff(element.parentNode.rowIndex, element.cellIndex);
}

将值从html表传递到另一个html / js

1 个答案: