jQuery EasyUI开发技巧总结


Posted in jQuery onSeptember 26, 2017

jQuery EasyUI开发技巧总结

1、使用tabs时,如果使用的不是url,而是content,则要嵌入iframe

addTab({
        title:node.text,
        closeable:true,
        content:‘<iframe src="'+url+'" frameborder="0" style="border:0;width:100%;height:99%"></iframe>
   });

1)外部调用iframe里面的标签内容

<button onclick="console.info($('iframe').contents().find('#frameId'));"/>

2)内部调用外部的方法:

onclick="parent.getData();"

2、查询提交表单:

function serarchFun(){//搜索
  $("#datagrid").datagrid("load", serializeObject($("#searchForm")));
}
function cleanFun(){//清空
  $("#searchForm input").val('');
  $("#datagrid").datagrid("load", {});
}

function removeFun(){//删除
  var rows=$("#datagrid").datagrid("getChecked");
  var ids[] = new Array();
  if(rows.length>0){
    for(var i=0;i<rows.length;i++){
      ids.push(row[i].id);
    }
    $.ajax({
      url:'${rootPath}/user_delete.action',
      data:{ids:ids.join(',')},
      dataType:'json',
      success:function(data){
        $('#datagrid').datagrid('load');
        $('#datagrid').datagrid('unselectAll');
        $.messager.Show({
          title:'提示',
          msg:data.msg
        });
      }
    })
  }else{
    $.messager.Show({
      title:'提示',
      msg:'不能删除'
    });
  }
}

3、添加checkbox:

$("#datagrid").datagrid(

  url:"${rootPath}/user_add.action",
  idField:'id',
  checkOnSelect:false,
  selectOnCheck:true,//选中复选框选中
  frozonColumns:[[{
    field:'id',
    title:'编号',
    width:150,
    checkbox:true
    },{
    field:'name',
    title:'登陆名称',
    width:150,
    sortable:true
  }]],
  columns:[[{
    field:'pwd',
    title:'密码',
    width:150,
    formatter: function(){
      return:"****************"
    }
  }]]
);

4、确认对话框:

$.messager.confirm('确认','你真的要删除吗?',function(data){
  if(data){

  }
});

5、编辑实现动态加载页面

function editFun(){
var rows=$("#datagrid").datagrid("getChecked");
  $('<div/>').dialog({
    width:500,
    height:200,
      href:'${rootPath}/edit.jsp,
      modal:true,
      title:'编辑用户',
      buttons:[{
        text:编辑,
        handler:function(){
            $('#editForm').form('submit',{
              url:'${rootPath}/user_edit.action',
              success:function(data){
                var obj = JQuery.parseJSON(data);
                if(obj.success){
                  $('#edit_dialog').dialog('close');
                }
                $.messager.show({
                  title:'提示',
                  msg:obj.msg
                });
              }
            }
        }
      }],
      onClose:function(){//必须写的
        $(this).dialog('destroy');
      },
      onOpen:function(){
        var data = rows[0];
      },
      onLoad:function(){//初始化数据,填充数据
        var data = rows[0];
        $("#editForm").form("load", data);
      }
  });
}

6、更新行

var rows=(‘#datagrid').datagrid(‘getChecked');(‘#datagrid').datagrid(‘updateRow',{ 
index:$(‘#datagrid').datagrid(‘getRowIndex',rows[0]), 
row:result.obj

});

 希望通过本文能帮助到大家,大家如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

jQuery 相关文章推荐
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
May 08 jQuery
jQuery鼠标移动图片上实现放大效果
Jun 25 jQuery
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解
Aug 01 jQuery
jQuery length 和 size()区别总结
Apr 26 jQuery
jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】
May 26 jQuery
jQuery插件实现弹性运动完整示例
Jul 07 jQuery
jQuery实现输入框的放大和缩小功能示例
Jul 21 jQuery
解决JQuery的ajax函数执行失败alert函数弹框一闪而过问题
Apr 10 jQuery
jquery选择器和属性对象的操作实例分析
Jan 10 jQuery
jquery实现垂直手风琴导航栏
Feb 18 jQuery
jQuery使用jsonp实现百度搜索的示例代码
Jul 08 jQuery
JQuery绑定事件四种实现方法解析
Dec 02 jQuery
jQuery 开发之EasyUI 添加数据的实例
Sep 26 #jQuery
JS+jQuery实现注册信息的验证功能
Sep 26 #jQuery
zTree jQuery 树插件的使用(实例讲解)
Sep 25 #jQuery
jQuery使用zTree插件实现可拖拽的树示例
Sep 23 #jQuery
一个有意思的鼠标点击文字特效jquery代码
Sep 23 #jQuery
JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码
Sep 23 #jQuery
jQuery实现table中两列CheckBox只能选中一个的示例
Sep 22 #jQuery
You might like
【星际争霸1】人族1v7家ZBath
2020/03/04 星际争霸
PHP 配置文件中open_basedir选项作用
2009/07/19 PHP
PHP 裁剪图片成固定大小代码方法
2009/09/09 PHP
关于php mvc开发模式的感想
2011/06/28 PHP
PHP根据传来的16进制颜色代码自动改变背景颜色
2014/06/13 PHP
php中使用Ajax时出现Error(c00ce56e)的详细解决方案
2014/11/03 PHP
关于php微信订阅号开发之token验证后自动发送消息给订阅号但是没有消息返回的问题
2015/12/21 PHP
基于thinkPHP3.2实现微信接入及查询token值的方法
2017/04/18 PHP
浅谈使用 Yii2 AssetBundle 中 $publishOptions 的正确姿势
2017/11/08 PHP
laravel框架中控制器的创建和使用方法分析
2019/11/23 PHP
PHP大文件分割分片上传实现代码
2020/12/09 PHP
快速解决jQuery与其他库冲突的方法介绍
2014/01/02 Javascript
用json方式实现在 js 中建立一个map
2014/05/02 Javascript
jquery实现移动端点击图片查看大图特效
2020/09/11 Javascript
JS+CSS实现DIV层的展开、收缩效果
2016/01/28 Javascript
js实现倒计时及时间对象
2016/11/15 Javascript
JS表单验证方法实例小结【电话、身份证号、Email、中文、特殊字符、身份证号等】
2017/02/14 Javascript
分享Bootstrap简单表格、表单、登录页面
2017/08/04 Javascript
NestJs 静态目录配置详解
2019/03/12 Javascript
python正则表达式re之compile函数解析
2017/10/25 Python
ubuntu17.4下为python和python3装上pip的方法
2018/06/12 Python
详解python3安装pillow后报错没有pillow模块以及没有PIL模块问题解决
2019/04/17 Python
python Pandas如何对数据集随机抽样
2019/07/29 Python
基于Python数据结构之递归与回溯搜索
2020/02/26 Python
Python基于httpx模块实现发送请求
2020/07/07 Python
Python使用windows设置定时执行脚本
2020/11/12 Python
Python中pass的作用与使用教程
2020/11/13 Python
Belle Maison倍美丛官网:日本千趣会旗下邮购网站
2016/07/22 全球购物
美国精品家居用品网站:US-Mattress
2016/08/24 全球购物
猫途鹰英国网站:TripAdvisor英国(旅游社区和旅游评论)
2016/08/30 全球购物
德国婴儿推车和儿童安全座椅商店:BABYSHOP
2016/09/01 全球购物
安全责任书怎么写
2014/07/28 职场文书
邹越感恩父母演讲稿
2014/08/28 职场文书
2014高中生入党思想汇报范文
2014/09/13 职场文书
2014年大学生职业规划书:未来不是梦,只要勇敢冲!
2014/09/22 职场文书
gtx1650怎么样 gtx1650显卡相当于什么级别
2022/04/08 数码科技