jQWidgets jqxTreeGrid rowUnselect事件

以下是关于 jQWidgets jqxTreeGrid 组件中 rowUnselect 事件的详细攻略。

jQWidgets jqxTreeGrid rowUnselect 事件

jQWidgets jqxTreeGrid 组件的 rowUnselect 事件在用户取消选择 TreeGrid 控件的行时触发。设置 rowUnselect 事件处理程序，可以在用户取消选择行时执行自定义操作。

语法

$('#treegrid').on('rowUnselect', function (event) {
    // 在此处执行自定义操作
});

示例

以下两个示例演示如何使用 rowUnselect 事件。

示例 1

// 在用户取消选择行时清除行数据的详细信息
$('#treegrid').on('rowUnselect', function (event) {
    var args = event.args;
    var row = args.row;
    var container = '<div style="overflow: hidden;">';
    for (var property in row) {
        container += '<div style="float: left; width: 50%;">' + property + '</div>';
        container += '<div style="float: left; width: 50%;">' + row[property] + '</div>';
    }
    container += '</div>';
    $('#details').html('');
});

在示例 1 中，我们使用 rowUnselect 事件在用户取消选择行时清除行数据的详细信息。我们使用一个空的 HTML 元素来清除详细信息。

示例 2

// 在取消选择行取消高亮显示该行
$('#treegrid').on('rowUnselect', function (event) {
    var args = event.args;
    var row = args.row;
    $('#treegrid').jqxTreeGrid('unselectRow', row.id);
});

在示例 2 中，我们使用 rowUnselect 事件在用户取消选择行时取消高亮显示该行。我们使用 unselectRow 方法来取消高亮显示该行。

总之，rowUnselect 事件允许您在用户取消选择 TreeGrid 控件的行时执行自定义操作。您可以使用该事件除数据的详细信息或取消高亮显示该行等。