jQWidgets jqxDataTable getCellValue() 方法

简介

jQWidgets jqxDataTable 是一个适用于 Web 应用程序的代码库，它提供了多种特性以及 UI 组件。getCellValue() 方法是 jqxDataTable 组件中的一个方法，用于获取 jqxDataTable 的某行某列的值。

语法

getCellValue(rowBoundIndex, dataField)

• rowBoundIndex：Number 类型，必需，指定要获取值的行索引。
• dataField：String 类型，必需，指定要获取值的列数据字段。

实例

<!-- 引入相关的 js/css 文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jqwidgets-scripts/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jqwidgets-scripts/jqwidgets/styles/jqx.bootstrap.css">
<script src="https://cdn.jsdelivr.net/npm/jqwidgets-scripts/jqwidgets/jqxcore.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jqwidgets-scripts/jqwidgets/jqxdata.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jqwidgets-scripts/jqwidgets/jqxdatatable.js"></script>

<!-- 在页面上定义一个 div，用于显示 jqxDataTable 组件 -->
<div id="jqxDataTable"></div>

<script>
    // 创建 jqxDataTable
    var dataTable = new jqx.data.DataTable({
        localData: [
            {name: 'John Smith', age: 30, gender: 'Male'},
            {name: 'Jane Doe', age: 25, gender: 'Female'},
            {name: 'Bob Johnson', age: 45, gender: 'Male'}
        ],
        // 定义列数据字段
        datafields: [
            { name: 'name', type: 'string' },
            { name: 'age', type: 'number' },
            { name: 'gender', type: 'string' }
        ]
    });

    // 初始化 jqxDataTable
    $('#jqxDataTable').jqxDataTable({
        width: '100%',
        autoRowHeight: true,
        source: dataTable,
        columns: [
            { text: 'Name', dataField: 'name', width: 200 },
            { text: 'Age', dataField: 'age', width: 100 },
            { text: 'Gender', dataField: 'gender', width: 100 }
        ]
    });

    // 使用 getCellValue() 方法获取第二行的年龄
    var age = $('#jqxDataTable').jqxDataTable('getCellValue', 1, 'age');
    console.log(age); // 输出：25
</script>

扩展

除了 getCellValue() 方法，jqxDataTable 还提供了许多其他方法，可用于获取、修改、添加、删除行和列，以及搜索和排序等。更多详细信息，请参考 官方文档。