Easyui在treegrid添加控件的实现方法


Posted in Javascript onJune 23, 2017

 easyui 树加控件

最近看了一个easy感觉里面的树搞得还不错,虽然觉得让人有点不灵活的感觉,我们来说说怎么在树种添加控件效果

Easyui在treegrid添加控件的实现方法

在书中添加需要用到formatter这个属性,可以在加载的时候显示

function formatProgress(value){
 //console.log(value);
 if (value){
  var box = value.split(",");
  //console.log(box);
  var boxid = box[1];
  var s;
  //alert(value);
  if(box[0]=="显示"){
   s = '<input id='+boxid+' type="checkbox" onclick="isShow()" checked="checked">';
  }else{
   s = '<input id='+boxid+' type="checkbox" onclick="isShow()" >';
  }
  return s;
 } else {
  return '';
 }
}

这样在加载的时候会显示控件了,如果在加载的时候控制类型可以,根据value的值进行判断select的可以这样麻烦了一点但是也可以用。

function formatProgress1(value){
 console.log("formatProgress1 执行了");
 console.log(value);
 if (value){
  var box = value.split(",");
  console.log(box);
  var boxid = box[1];
  var s;
  if(box[0]=='缺省'){
   s= '<select class='+boxid+' onchange="isType()"><option selected="selected" value="0">缺省</option><option value="1">直接链接</option><option value="2">内容列表</option><option value="3">教学资源</option></select>'; 
  }else if(box[0]=='直接链接'){
   s= '<select class='+boxid+' onchange="isType()"><option value="0" >缺省</option><option value="1" selected="selected">直接链接</option><option value="2">内容列表</option><option value="3">教学资源</option></select>'; 
  }else if(box[0]=='内容列表'){
   s= '<select class='+boxid+' onchange="isType()"><option value="0" >缺省</option><option value="1">直接链接</option><option selected="selected" value="2">内容列表</option><option value="3">教学资源</option></select>'; 
  }else if(box[0]=='教学资源'){
   s= '<select class='+boxid+' onchange="isType()"><option value="0" >缺省</option><option value="1">直接链接</option><option value="2">内容列表</option><option selected="selected" value="3">教学资源</option></select>'; 
  }
  return s;
 } else {
  return '';
 }
}

easyui里面的东西有些还是挺灵活的,但是样式上面没有bootstrap做的好看,但是我觉树做的真心可以。

以上所述是小编给大家介绍的Easyui在treegrid添加控件的实现方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript 主动派发事件总结
Aug 09 Javascript
用Jquery.load载入页面实现局部刷新
Jan 22 Javascript
jQuery Migrate 1.1.0 Released 注意事项
Jun 14 Javascript
Express的路由详解
Dec 10 Javascript
jquery跟随屏幕滚动效果的实现代码
Apr 13 Javascript
又一枚精彩的弹幕效果jQuery实现
Jul 25 Javascript
JS设计模式之命令模式概念与用法分析
Feb 06 Javascript
在vue项目中使用sass的配置方法
Mar 20 Javascript
php中and 和 &amp;&amp;出坑指南
Jul 13 Javascript
js Array.slice的8种不同用法示例
Jul 10 Javascript
vue集成一个支持图片缩放拖拽的富文本编辑器
Jan 29 Vue.js
JavaScript实现登录窗体
Jun 22 Javascript
详解用vue.js和laravel实现微信支付
Jun 23 #Javascript
详解用vue.js和laravel实现微信授权登陆
Jun 23 #Javascript
妙用Angularjs实现表格按指定列排序
Jun 23 #Javascript
VUE中v-model和v-for指令详解
Jun 23 #Javascript
JavaScript正则表达式简单实用实例
Jun 23 #Javascript
js中的事件委托或是事件代理使用详解
Jun 23 #Javascript
JS判断非空至少输入两个字符的简单实现方法
Jun 23 #Javascript
You might like
Symfony数据校验方法实例分析
2015/01/26 PHP
使用PHP生成二维码的方法汇总
2015/07/22 PHP
Laravel5中防止XSS跨站攻击的方法
2016/10/10 PHP
PHP实现文件上传功能实例代码
2017/05/18 PHP
PHP创建自己的Composer包方法
2018/04/09 PHP
laravel实现登录时监听事件,添加登录用户的记录方法
2019/09/30 PHP
Laravel第三方包报class not found的解决方法
2019/10/13 PHP
laravel使用数据库测试注意事项
2020/04/10 PHP
jQuery使用手册之一
2007/03/24 Javascript
jquery 选择器部分整理
2009/10/28 Javascript
asp.net+jquery滚动滚动条加载数据的下拉控件
2010/06/25 Javascript
javascript与webservice的通信实现代码
2010/12/25 Javascript
jquery图片滚动放大代码分享(2)
2015/08/28 Javascript
在Node.js中使用Javascript Generators详解
2016/05/05 Javascript
聊一聊JS中的prototype
2016/09/29 Javascript
简单实现js悬浮导航效果
2017/02/05 Javascript
详解nodeJS中读写文件方法的区别
2017/03/06 NodeJs
js模块加载方式浅析
2017/08/12 Javascript
vue2.0 可折叠列表 v-for循环展示的实例
2018/09/07 Javascript
Jquery获取radio选中值实例总结
2019/01/17 jQuery
python中查找excel某一列的重复数据 剔除之后打印
2013/02/10 Python
python使用Matplotlib画条形图
2020/03/25 Python
Django发送邮件功能实例详解
2019/09/02 Python
Python3+Appium安装及Appium模拟微信登录方法详解
2021/02/16 Python
Python文件操作的面试题
2013/06/22 面试题
如何客观的进行自我评价
2013/12/17 职场文书
影视动画专业个人的自我评价
2013/12/31 职场文书
《我为你骄傲》教学反思
2014/02/20 职场文书
读书伴我成长演讲稿
2014/05/07 职场文书
答谢会策划方案
2014/05/12 职场文书
求职信模板
2014/05/23 职场文书
土建工程师岗位职责
2014/06/10 职场文书
服务员态度差检讨书
2014/10/28 职场文书
2015最新学生自我评价范文
2015/03/03 职场文书
销售开票员岗位职责
2015/04/15 职场文书
信息技术国培研修日志
2015/11/13 职场文书