easyui 动态生成datagrid

 function getItemTable(id, type) {
        tabInfoItem.datagrid({
            url:'',
            data: [],
            columns: [[]],
            pagination:false
        });
        var url = '/InfoItemList';
        var para = {};
        if (type == 'code') {
            url = '/CodeValueList';
            para.itemId = id;
        } else {
            para.setId = id;
        }

        var column = [[]];
        if (type == 'code') {
            column[0][0] = { field: 'code', title: '代码', width: 50, align: 'center' };
            column[0][1] = { field: 'name', title: '名称' };

        } else {
            column[0][0] = { field: 'sn', title: '编号', width: 80, align: 'center' };
            column[0][1] = { field: 'name', title: '名称', width: 80, align: 'center' };
            column[0][2] = { field: 'description', title: '中文名称', align: 'center' };
            column[0][3] = {
                field: 'itemtype', title: '类型', width: 80, align: 'center', formatter: function (value, row, index) {
                    var str = '';
                    for (i = 0; i < itemTypeList.length; i++) {
                        if (itemTypeList[i].id == value) {
                            str = itemTypeList[i].value;
                            break;
                        }
                    }
                    return str;
                }
            };
            column[0][4] = { field: 'itemlength', title: '长度', width: 50, align: 'center' };
            column[0][5] = { field: 'remark', title: '备注', align: 'left' };
        }

        var dataconfig = {
            url: url,
            idField: 'id',
            rownumbers: true,
            singleSelect: true,
            striped: true,
            fit: true,
            border: true,
            columns: column
        }

        if (type == 'code') {
            dataconfig.pagination = true;
            dataconfig.pageSize = 30;
            dataconfig.queryParams = { itemId: id };
        } else {
            dataconfig.queryParams = { setId: id };
        }

        tabInfoItem.datagrid(dataconfig);

        if (type == 'code') {
            var p = tabInfoItem.datagrid('getPager');
            (p).pagination({
                beforePageText: '第',//页数文本框前显示的汉字
                afterPageText: '页    共 {pages} 页',
                displayMsg: '共{total}条数据'

            });
        }
    }

清空行、列、分页:

tabInfoItem.datagrid({
            url:'',
            data: [],
            columns: [[]],
            pagination:false
        });

实现了同一个表格的不同数据源,不同参数,是否分页的参数化显示。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
使用 EasyUI 动态生成表单可以通过以下步骤实现: 1. 定义一个容器,例如 `<div id="formContainer"></div>`。 2. 使用 jQuery 创建一个表单元素,并设置其属性和样式。例如: ``` var $form = $("<form></form>"); $form.attr("id", "dynamicForm"); $form.attr("method", "post"); $form.attr("action", "save.php"); $form.addClass("easyui-form"); $form.appendTo("#formContainer"); ``` 3. 创建需要添加到表单中的表单元素,例如 input、select 等。 4. 将创建的表单元素添加到动态表单中。例如: ``` var $input = $("<input></input>"); $input.attr("type", "text"); $input.attr("id", "username"); $input.attr("name", "username"); $input.appendTo($form); ``` 5. 最后,使用 EasyUI 的 `$.parser.parse()` 方法对动态表单进行初始化,以便 EasyUI 样式和行为正确应用到表单上。例如: ``` $.parser.parse("#dynamicForm"); ``` 完整示例代码如下: ``` <div id="formContainer"></div> <script> var $form = $("<form></form>"); $form.attr("id", "dynamicForm"); $form.attr("method", "post"); $form.attr("action", "save.php"); $form.addClass("easyui-form"); $form.appendTo("#formContainer"); var $input = $("<input></input>"); $input.attr("type", "text"); $input.attr("id", "username"); $input.attr("name", "username"); $input.appendTo($form); var $select = $("<select></select>"); $select.attr("id", "gender"); $select.attr("name", "gender"); var $option1 = $("<option></option>"); $option1.attr("value", "male"); $option1.text("Male"); var $option2 = $("<option></option>"); $option2.attr("value", "female"); $option2.text("Female"); $select.append($option1); $select.append($option2); $select.appendTo($form); $.parser.parse("#dynamicForm"); </script> ``` 注意,动态表单中的表单元素需要按照 EasyUI 的规则设置 id 和 name 属性,以便 EasyUI 能够正确处理表单数据。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值