jquery easyui dataGrid动态改变排序字段名的方法


Posted in Javascript onMarch 02, 2017

jQuery easyui dataGrid 动态改变排序字段名,一般情况下,在使用的时候,我们会点击相应字段进行排序,这里以JAVA为例,后端的实体类字段有可能和数据库的字段不一致;

如:实体类中的属性为userName,前台filed="userName"而数据库的字段为user_name,这个时候如果把userName设置为排序列,然后去进行点击,就会抛出异常,因为dataGrid在排序的时候会以filed="userName"中的字段名为排序字段;

问题:

怎么把userName和数据库中的user_name进行做映射

解决方案:

1:在后台服务器端对前台传入的排序字段进行判断,并且手工进行映射为数据库中的字段名;

             优点:安全、数据库字段不会暴露在前台HTML页面中;

             缺点:后台代码中会出现很多的字段映射判断;

2:在前台点击排序字段列的时候做判断,通过JS脚本在前台页面判断进行映射为数据库中的字段名;

             优点:方便,不需要修改服务器端代码

             缺点:不安全,数据库真实字段名会暴露在HTML页面中;            

  注意:如果对安全性要求比较高建议选择第一种;

这里采用第二种方式,实现如下:

/** 
 *在点击排序字段时,改变传入后台的字段 
 *param对应onBeforeLoad事件的参数 
 *map自定义的字段映射Map 
 */ 
onSortColumn=function(param,map){ 
  //取出map中字段的映射关系值 
  var fieldSort=map[param.sort]; 
  if(fieldSort!='' && fieldSort!=undefined){ 
    //设置新的排序字段名,设置完之后,发送请求时一并会发送到服务端 
    param.sort=fieldSort; 
  } 
}

使用方法:

//创建Map 
var map = new Map(); 
//为map添加值;key:对应filed="userName"中的字段名;value:对应数据库的字段 
map['userName']='user_name'; 
 
$('#datagrid').datagrid({ 
  onBeforeLoad:function(param){ 
    onSortColumn(param,map); 
  } 
});

以上所述是小编给大家介绍的jquery easyui dataGrid动态改变排序字段名的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JS提交并解析后台返回的XML的代码
Nov 03 Javascript
Firefox下提示illegal character并出现乱码的原因
Mar 25 Javascript
js实现的早期滑动门菜单效果代码
Aug 27 Javascript
AngularJs directive详解及示例代码
Sep 01 Javascript
JavaScript中Array对象用法实例总结
Nov 29 Javascript
bootstrap模态框跳转到当前模板页面 框消失了而背景存在问题的解决方法
Nov 30 Javascript
JS实现json对象数组按对象属性排序操作示例
May 18 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
Aug 31 Javascript
详解小程序循环require之坑
Mar 08 Javascript
vue+eslint+vscode配置教程
Aug 09 Javascript
js new Date()实例测试
Oct 31 Javascript
关于Node.js中频繁修改代码重启服务器的问题
Oct 15 Javascript
JavaScript正则替换HTML标签功能示例
Mar 02 #Javascript
如何正确理解javascript的模块化
Mar 02 #Javascript
jquery实现左右滑动式轮播图
Mar 02 #Javascript
如何写好你的JavaScript【推荐】
Mar 02 #Javascript
js前端日历控件(悬浮、拖拽、自由变形)
Mar 02 #Javascript
JS操作input标签属性checkbox全选的实现代码
Mar 02 #Javascript
JavaScript正则获取地址栏中参数的方法
Mar 02 #Javascript
You might like
PHP 二级子目录(后台目录)设置二级域名
2017/03/02 PHP
PHP5.6新增加的可变函数参数用法分析
2017/08/25 PHP
JavaScript 继承详解 第一篇
2009/08/30 Javascript
JavaScript Scoping and Hoisting 翻译
2012/07/03 Javascript
JavaScript代码简单实现求杨辉三角给定行的最大值
2013/10/29 Javascript
js实现带搜索功能的下拉框实时搜索实时匹配
2013/11/05 Javascript
js模拟hashtable的简单实例
2014/03/06 Javascript
js根据鼠标移动速度背景图片自动旋转的方法
2015/02/28 Javascript
原生js页面滚动延迟加载图片
2015/12/20 Javascript
JQuery的常用选择器、过滤器、方法全面介绍
2016/05/25 Javascript
基于twbsPagination.js分页插件使用心得(分享)
2017/10/21 Javascript
学习Vue组件实例
2018/04/28 Javascript
15分钟学会vue项目改造成SSR(小白教程)
2019/12/17 Javascript
Vue 封装防刷新考试倒计时组件的实现
2020/06/05 Javascript
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
2020/07/09 Javascript
[01:16:16]DOTA2-DPC中国联赛定级赛 RNG vs Phoenix BO3第二场 1月8日
2021/03/11 DOTA
Python 数据结构之旋转链表
2017/02/25 Python
PyCharm+PySpark远程调试的环境配置的方法
2018/11/29 Python
python对列进行平移变换的方法(shift)
2019/01/10 Python
python opencv实现图像边缘检测
2019/04/29 Python
Python中那些 Pythonic的写法详解
2019/07/02 Python
flask框架路由常用定义方式总结
2019/07/23 Python
Python数学形态学实例分析
2019/09/06 Python
python set集合使用方法解析
2019/11/05 Python
运行python提示no module named sklearn的解决方法
2020/11/29 Python
详解Pycharm第三方库的安装及使用方法
2020/12/29 Python
详解HTML5新增标签
2017/11/27 HTML / CSS
新加坡航空官方网站:Singapore Airlines
2016/10/13 全球购物
什么是类的返射机制
2016/02/06 面试题
农救科工作职责
2013/11/27 职场文书
旷课检讨书2000字
2014/01/14 职场文书
人力资源经理的岗位职责范本
2014/02/28 职场文书
青年志愿者活动总结
2014/04/26 职场文书
党员群众路线对照检查材料思想汇报
2014/09/17 职场文书
2014年业务工作总结
2014/11/17 职场文书
JS前端使用Canvas快速实现手势解锁特效
2022/09/23 Javascript