easyui datagrid中使用combobox方法

最新推荐文章于 2023-11-11 16:57:18 发布

原创最新推荐文章于 2023-11-11 16:57:18 发布 · 2.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#datagrid #combo box #easyui

easyui 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种在JavaScript中定义并配置下拉框数据的方法。通过创建一个包含多个年份记录的JSON数组，每条记录包含'id'和'name'两个字段，用于设置下拉框的选项值和显示文本。随后展示了如何在HTML表格中利用这些数据来初始化一个不可编辑的、必填的组合框。

首先定义js变量

var ndJSON = [
            {
                "id": "2015-01-01",
                "name": "2015"
            },
            {
                "id": "2016-01-01",
                "name": "2016"
            },
            {
                "id": "2017-01-01",
                "name": "2017"
            },
            {
                "id": "2018-01-01",
                "name": "2018"
            },
            {
                "id": "2019-01-01",
                "name": "2019"
            },
            {
                "id": "2020-01-01",
                "name": "2020"
            },
            {
                "id": "2021-01-01",
                "name": "2021"
            },
            {
                "id": "2022-01-01",
                "name": "2022"
            },
            {
                "id": "2023-01-01",
                "name": "2023"
            },
            {
                "id": "2024-01-01",
                "name": "2024"
            }
        ];

之后对应的使用下拉框的列如下

<th data-options="field:'ND',width:300,align:'center',editor:{type:'combobox',options :
                                                {data:ndJSON,valueField:'id',textField: 'name',panelHeight: 'auto', required: true , editable:false }}">年度</th>