📜  jQWidgets jqxDataTable ready 属性(1)

📅  最后修改于: 2023-12-03 14:43:21.667000             🧑  作者: Mango

jQWidgets jqxDataTable ready 属性

概述

jqxDataTable 是一款基于 jQuery 的表格控件,具有可定制化的列和行,支持多行编辑和多种数据绑定方式。其中,ready 属性表示 jqxDataTable 加载数据完成后触发的事件,供开发者进行一些数据处理。

标准用法

可通过以下方式将 jqxDataTable 加载到页面:

<script type="text/javascript">
    $(document).ready(function () {
        $("#dataTable").jqxDataTable({
            source: dataAdapter,
            columns: [
                { text: 'Name', dataField: 'name', width: 80 },
                { text: 'Age', dataField: 'age', width: 50, cellsAlign: 'center' },
                { text: 'Email', dataField: 'email', width: 200 },
                { text: 'Address', dataField: 'address', width: 300 }
            ]
        });
    });
</script>

其中 source 表示数据源,columns 表示列的定义,详细参数可参考 jqxDataTable 文档

在数据加载完成后,可通过 ready 事件获取 jqxDataTable 对象,进行数据处理等操作:

$('#dataTable').on('ready', function (event) {
    var data = $('#dataTable').jqxDataTable('getRows');
    console.log(data);
    // do something with data
});
事件说明

ready 事件参数是一个事件对象,包括以下属性:

| 属性名称 | 类型 | 说明 | | -- | -- | -- | | sender | Object | 触发事件的对象,即 jqxDataTable 控件本身 | | args | Object | 一个包含两个属性的对象:data 和 rows |

其中,data 表示当前表格数据,rows 表示当前渲染出来的表格行。

注意事项