easyui datagrid 动态操作editor 的方法

easyui本身是不提供这么细节的功能的,需要我们自己拓展下:

在easyui.min.js中扩展:

$.extend($.fn.datagrid.methods, {

addEditor : function(jq, param) {

if (param instanceof Array) {

$.each(param, function(index, item) {

var e = $(jq).datagrid(‘getColumnOption‘, item.field);

e.editor = item.editor; });

} else {

var e = $(jq).datagrid(‘getColumnOption‘, param.field);

e.editor = param.editor;

}

},

removeEditor : function(jq, param) {

if (param instanceof Array) {

$.each(param, function(index, item) {

var e = $(jq).datagrid(‘getColumnOption‘, item);

e.editor = {};

});

} else {

var e = $(jq).datagrid(‘getColumnOption‘, param);

e.editor = {};

}

}

});

然后在项目中应用如下:

删除 editor:

$("#dg").datagrid(‘removeEditor‘,‘cardNo‘);//这里的cardNo是需要移除editor的列的field值

添加editor:

$("#dg").datagrid(‘addEditor‘,[ //添加cardNo列editor

{field:‘cardNo‘,editor:{

type:‘textbox‘,

options:{

required:true,

validType:‘length[3,3]‘,

invalidMessage:‘请输入3位号码!‘

}

}

}]

时间: 2025-01-03 04:41:40

easyui datagrid 动态操作editor 的方法的相关文章

jQuery EasyUI datagrid实现本地分页的方法

本文实例讲述了jQuery EasyUI datagrid实现本地分页的方法.分享给大家供大家参考.具体如下: 一般分页都是后台做,前端做无论从哪方面考虑都不合适.但是有的时候还是有这种需求. 这里重点用到了pagination的监听,以及JS数组的slice方法来完成.代码如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 3

jquery easyui datagrid动态改变title的值

title:'<input type="text" id="txtTitle1" style="background:none;border:none;"/>', onLoadSuccess:function(data) { $("#txtTitle1").val("所有教师 人数:"+$("#IndeterminateMembers").datagrid("get

easyui datagrid 动态加入、移除editor

使用easyui 行编辑的时候完毕编辑的功能比較简单,可是假设要依据一个框的值动态改变别的值或者编辑的时候禁用某个框的时候就比較麻烦了. 比方像以下这样:加入行的时候每一个值都是手动输入,改动的时候第一个值不能改动.我们来看下怎么实现这种效果. easyui本身是不提供这么细节的功能的.须要我们自己拓展下: 在编辑的时候移除第一列的editor属性,加入的时候,加入第一列的属性. //扩展datagrid:动态加入删除editor $.extend($.fn.datagrid.methods,

JQuery EasyUI DataGrid动态合并单元格

/**        * EasyUI DataGrid根据字段动态合并单元格        * @param fldList 要合并table的id        * @param fldList 要合并的列,用逗号分隔(例如:"name,department,office");        */        function MergeCells(tableID, fldList) {            var Arr = fldList.split(",&quo

jQuery Easyui datagrid动态列绑定

前几天有人在使用jQuery EasyUI的datagrid时,遇到不会动态绑定列的情况,而网上给出的例子可能也是比较早的处理办法,竟然需要修改easyui源码,其实解决这问题的思路是很简单,我们只需修改要显示的列即可.那位朋友最后改为这种处理时,发现还是有问题,最终我发现她返回不是合法json,里边多个方括号,这里推荐大家使用本站的JSON在线校验格式化工具来验证返回json是否正确. 这里我们以上篇文章中类似的简单json来说明这个问题,比如后台要根据当前用户的权限返回不同的json: 分享

转 -- MVC+EF easyui dataGrid 动态加载分页表格

首先上javascript的代码 <script type="text/javascript"> $(function () { LoadGrid(); }) //加载表格!!! function LoadGrid() { $('#roleGrid').datagrid({ width: 900, striped: true, //交替条纹 fitColumns: true, //防止水平滚动 fit: true,//自动补全 iconCls: "icon-sav

easyui datagrid 动态添加columns属性

公司在项目设计的时候,有一个需求,就是查出来的表的字段不唯一,一张表的字段可能是三个,也可能是五个,但是却要把它显示到页面,这个给我做ui的带来一点麻烦.因为以前一般用easyui 的datagrid里的columns属性都是对应数据库表里的字段,现在字段都不知道,怎么用datagrid显示数据呢?本人在这里介绍最笨的办法,就是拼接出columns 属性的格式,我承认,我的办法效率不高,但是当你无从下手的时候,,这未尝不是解决问题的办法,当然在解决这个问题之前,我也百度了一下,试了一些办法,有的

jquery easyui datagrid 动态 加载列

实现方式: 首先根据输入的sql语句获得相关的列名称返回给前台,然后在datagrid中动态加载列,接着根据查询条件(包括sql语句)获取相关的记录返回给前台用于填充datagrid.从而实现类似oracle web版的sql查询. 前台主要js为: Js代码   function sqlSearch(){ var sqlStatement = $.trim($("#sqlStatementId").val()); if(sqlStatement == null || sqlState

EasyUI datagrid动态添加列

任务描述:根据用户选择时间段,生成列数据,如图 一.先定义好datagrid固定的数据列 <script type="text/javascript"> $(document).ready(function () { $("#td_Radio").datagrid({ striped: true, border: true, iconCls: 'icon-edit', //图标 singleSelect: true, autoRowHeight: tru