easyui DataGrid checkbox 根据后台传递过来的数据进行勾选

最新推荐文章于 2022-04-30 04:59:01 发布

kaleid_liner

最新推荐文章于 2022-04-30 04:59:01 发布

阅读量8.9k

点赞数 1

分类专栏： EasyUI

本文链接：https://blog.youkuaiyun.com/qq_36735409/article/details/79564026

版权

EasyUI 专栏收录该内容

22 篇文章

订阅专栏

本文介绍了如何在EasyUI的DataGrid中，利用onLoadSuccess事件根据后台返回的数据动态设置复选框的状态。通过判断后台传递的数据显示，当值为'1'时，对应的表格行会被设置为选中状态。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

function loadMessage() {
    $('#pressure').datagrid({
        height: 500,
        url: '/Home/RealtimeData',
        method: 'POST',
        //queryParams: { 'id': OBJECTID },
        idField: 'ID',
        striped: true,
        fitColumns: true,
        singleSelect: false,
        rownumbers: true,
        pagination: false,
        nowrap: false,
        pageSize: 10,
        pageList: [10, 20, 50, 100, 150, 200],
        showFooter: true,
        columns: [[
            { field: 'ck', checkbox: true },
            { field: 'ElementId', title: 'ElementId', width: 180, align: 'left' },
            { field: 'Label', title: 'Label', width: 180, align: 'left' },
            { field: 'Meter_Name', title: 'Meter_Name', width: 180, align: 'left' },
            { field: 'Station_Un', title: 'Station_Un', width: 180, align: 'left' },
            { field: 'MeasureAre', title: 'MeasureAre', width: 180, align: 'left' },
            { field: 'DistrictAr', title: 'DistrictAr', width: 180, align: 'left' },
            { field: 'Explain', title: 'Explain', width: 180, align: 'left' }
        ]],
        onBeforeLoad: function (param) {

        },
        onLoadSuccess: function (data) {
            if (data) {
                $.each(data.rows, function (index, item) {
                    if (item.Display == 1) {
                        $('#pressure').datagrid('checkRow', index);
                    }
                });
            }
        },
        onLoadError: function () {

        },
        onClickCell: function (rowIndex, field, value) {

        }
    });
}

在onLoadSuccess 事件中添加循环事件，如果display显示的是一，则将当前那一行设为选中状态。