EasyUI整合篇
easyui-tabs动态添加
- <div class="easyui-tabs" fit="true" border="false" id="tabs" style="height: 500px;">
- <div title="首页">
- <div align="center" style="padding-top: 100px;"><font color="red" size="8">欢迎使用EasyUi在线中文示例文档(Java后台版)</font></div>
- <div align="center"><font color="red" size="8">请使用IE9,谷歌,火狐,不支持IE低版本</font></div>
- <div align="center"><font color="red" size="6">版权所有<a href="https://www.cnblogs.com/elves/" target=_blank>hy</a>,侵权必究</font></div>
- </div>
- </div>
- <script>
- // 新增Tab
- function openTab(text, url) {
- if ($("#tabs").tabs('exists', text)) {
- $("#tabs").tabs('select', text);
- } else {
- var content = "<iframe frameborder='0' scrolling='auto' style='width:100%;height:100%' src=" + url + "></iframe>";
- $("#tabs").tabs('add', {
- title: text,
- closable: true,
- content: content
- });
- }
- }
- </script>
/*更新tab*/
1.
- var $tabs = $('#tabs');
- var currTab = $tabs.tabs('getSelected'); //获得当前tab
- var url = $(currTab.panel('options').content).attr('src');//获取当前url
- //刷新当前tab
- $tabs.tabs('update', {
- tab: currTab,
- options: {
- //href: url//加载html内容
- content: "<iframe frameborder='0' scrolling='auto' style='width:100%;height:100%' src=" + url + "></iframe>"//加载iframe
- }
- });
2.currTab.panel('refresh', url);
3.删除tab页 在新增一个tab
4.跳到对应的tab 在刷新
- function addTab(title, url) {
- if ($('#tabs').tabs('exists', title)) {
- var currtab = $('#tabs').tabs('getSelected');
- var tab = $("#tabs").tabs("getTab", title);
- if (currtab == tab) {
- var url=$(currtab.panel('options').content).attr('src');
- refreshTab(tab, url);
- }
- else {
- var tab = $("#tabs").tabs("select", title);
- var currtab = $('#tabs').tabs('getSelected');
- var url = $(currtab.panel('options').content).attr('src');
- refreshTab(tab, url);
- }
- }
- else {
- var content = createFrame(url);
- $('#tabs').tabs('add',
- {
- title: title,
- content: content,
- closable: true
- });
- }
- }
- //跟新tab 对应的iframe
- function refreshTab(obj,url)
- {
- var refresh_tab = obj;
- if (refresh_tab && refresh_tab.find('iframe').length > 0)
- {
- var _refresh_ifram = refresh_tab.find('iframe')[0];
- _refresh_ifram.contentWindow.location.href = url;
- }
- }
- //tab重置宽高并不刷新和跳转
- $('#tabs').tabs('resize', {
- plain: false,
- boder: false,
- width: $("#tabs").parent().width() + ,
- height: $("#tabs").parent().height()
- });
easy ui combobox getValue 获取不到值问题
必须设置属性showblank: true,否则只能从onSelect事件中获取
- $("#ddlType").combobox({
- valueField: 'id',
- textField: 'text',
- editable: false,
- mode: 'local',
- data: defultlist,
- //showblank: true
- onSelect: function (row) {
- $("#ddlType").val(row.id);
- });
combobox 多选案例
- var JsonData = $("#hdWTData").val();
- var defultlist = [];//
- if (JsonData != "") {
- JsonData = JSON.parse(JsonData);
- for (var i = 0; i < JsonData.length - 1; i++) {
- defultlist.push({ "id": JsonData[i].BZlevelID, "text": JsonData[i].BZlevelName });
- }
- }
- $('#BZlevelID').combobox({
- valueField: 'id',
- textField: 'text',
- editable: false,
- //disabled: blDisabled,
- //required: true,
- showblank: true,
- //validType: 'cmbrequired',
- multiple: true,
- formatter: function (row) {
- var opts = $(this).combobox('options');
- return '<input type="checkbox" class="combobox-checkbox" value="' + row[opts.valueField] + '" title="' + row[opts.textField] + '"> ' + row[opts.textField]
- },
- mode: 'local',
- data: defultlist,
- onSelect: function (row) {
- var opts = $(this).combobox("options");
- var objCom = null;
- var children = $(this).combobox("panel").children();
- $.each(children, function (index, obj) {
- if (row[opts.valueField] == obj.getAttribute("value")) {
- objCom = obj;
- }
- });
- if (objCom != null && objCom.children && objCom.children.length > 0) {
- objCom.children[0].checked = true;
- }
- },
- onUnselect: function (row) {
- var opts = $(this).combobox("options");
- var objCom = null;
- var children = $(this).combobox("panel").children();
- $.each(children, function (index, obj) {
- if (row[opts.valueField] == obj.getAttribute("value")) {
- objCom = obj;
- }
- });
- if (objCom != null && objCom.children && objCom.children.length > 0) {
- objCom.children[0].checked = false;
- }
- }
- });
- if (defultlist.length > 0) {
- $("#BZlevelID").combobox("select", "3");
- $("#BZlevelID").combobox("select", "4");
- $("#BZlevelID").combobox("select", "5");
- }
- /*单个*/
- //获取值
- $('#Id').combobox('getValue');
- //设置值
- $('#Id').combobox('setValue','key')
- /*多个 multiple: true*/
- //获取值
- $('#Id').combobox('getValues');
- //设置值
- $('#Id').combobox('setValues','key1,key2,key3'.split(','))
- //自定义验证
- $.extend($.fn.validatebox.defaults.rules, {
- comboxRequired: {//combox必选验证
- validator: function (value, param) {
- return value != '--请选择--';
- },
- message: '该项为必选项.'
- },
- number: {//整数和小数验证
- validator: function (value) {
- var reg = /^\d+(\.\d+)?$/;
- return reg.test(value);
- },
- message: '请输入数字,并确保格式正确'
- },
- maxLength: {
- validator: function (value, param) {
- return value.length <= param[0];
- },
- message: '请输入长度为{0}的文本'
- },
- minLength: {
- validator: function(value, param){
- return value.length >= param[0];
- },
- message: 'Please enter at least {0} characters.'
- }
- });
- //验证调用-comboxRequired
- $("#select_ID").combobox({
- url: '',
- valueField: 'ID',
- textField: 'Name',
- editable: false,
- validType: 'comboxRequired',
- showblank: true,
- onSelect: function (row) {
- $("#select_ID").val(row.id);
- }
- });
- <input type="text" class="easyui-validatebox validatebox-text" validtype="number" />
- <input id="txtCertificateNumber" name="txtCertificateNumber" type="text" class="easyui-validatebox" validtype="number" data-options="required:true,validType:'maxLength[40]'" />
- //自定义验证
- $.extend($.fn.validatebox.defaults.rules, {
- isValidIP: {
- validator: function (value) {
- var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
- return reg.test(value);
- },
- message: '请输入正确IP格式'
- }
- });
- //IP验证-调用
- if (isValidIP(ProtocolIP) == false) {
- showTipsMsg("IP格式不正确!", '2500', '3');
- return;
- }
tree
- //tree checkbox全选反选
- function treeCheckedAll(bl, treeMenu) {
- $treeMenu = $('#' + treeMenu);
- if (bl) {
- var nodes = $treeMenu.tree('getChecked', 'unchecked');
- for (var i = 0; i < nodes.length; i++) {
- var node = $treeMenu.tree('find', nodes[i].id);//查找节点
- $treeMenu.tree('check', node.target);//将得到的节点选中
- }
- } else {
- var nodes = $treeMenu.tree('getChecked');
- for (var i = 0; i < nodes.length; i++) {
- var node = $treeMenu.tree('find', nodes[i].id);
- $treeMenu.tree('uncheck', node.target);
- }
- }
- }
- //checkbox控制单选
- $('#tree').tree({
- url:'xxx',
- checkbox: true,//出现checkbox
- onlyLeafCheck: true,//只允许选择子节点
- onCheck: treeSingleCheckCtrl//核心,单选控制
- });
- //单选控制
- function treeSingleCheckCtrl(node, checked) {
- var elementId = 'tree';//元素ID
- if (checked) {
- var allCheckedNodes = $('#' + elementId).tree("getChecked");
- for (var i = ; i < allCheckedNodes.length; i++) {
- var tempNode = allCheckedNodes[i];
- if (tempNode.id != node.id) {
- $('#' + elementId).tree('uncheck', tempNode.target);
- }
- }
- }
- }
- //同级-单选控制
- function treeSameSingleCheckCtrl(node, checked) {
- var elementId = 'tree';//元素ID
- if (checked) {
- $tree = $('#' + elementId);
- var pNode = $tree.tree('getParent', node.target);
- var tNodes = $tree.tree('getChildren', pNode.target);
- for (var i = ; i < tNodes.length; i++) {
- if (tNodes[i].id != node.id) {
- $tree.tree('uncheck', tNodes[i].target);
- }
- }
- }
- }
只允许选择子节点 onlyLeafCheck: true
- onBeforeSelect: function (node) {
- //返回树对象
- var tree = $(this).tree;
- //选中的节点是否为叶子节点,如果不是叶子节点,清除选中
- var isLeaf = tree('isLeaf', node.target);
- if (!isLeaf) {
- return false;
- }
- }
- //或onBeforeSelect、onSelect触发
- //返回树对象
- var tree = $(this).tree;
- //选中的节点是否为叶子节点,如果不是叶子节点,清除选中
- var isLeaf = tree('isLeaf', node.target);
- if (!isLeaf) {
- //清除选中
- //$('#tree').treegrid("unselect", node.target);
- $('#tree').treegrid("unselect");
- return false;
- }
- //easyUI中layout布局隐藏动态实现
- /**
- * layout方法扩展
- * @param {Object} jq
- * @param {Object} region
- */
- $.extend($.fn.layout.methods, {
- /**
- * 面板是否存在和可见
- * @param {Object} jq
- * @param {Object} params
- */
- isVisible: function(jq, params) {
- var panels = $.data(jq[0], 'layout').panels;
- var pp = panels[params];
- if(!pp) {
- return false;
- }
- if(pp.length) {
- return pp.panel('panel').is(':visible');
- } else {
- return false;
- }
- },
- /**
- * 隐藏除某个region,center除外。
- * @param {Object} jq
- * @param {Object} params
- */
- hidden: function(jq, params) {
- return jq.each(function() {
- var opts = $.data(this, 'layout').options;
- var panels = $.data(this, 'layout').panels;
- if(!opts.regionState){
- opts.regionState = {};
- }
- var region = params;
- function hide(dom,region,doResize){
- var first = region.substring(0,1);
- var others = region.substring(1);
- var expand = 'expand' + first.toUpperCase() + others;
- if(panels[expand]) {
- if($(dom).layout('isVisible', expand)) {
- opts.regionState[region] = 1;
- panels[expand].panel('close');
- } else if($(dom).layout('isVisible', region)) {
- opts.regionState[region] = 0;
- panels[region].panel('close');
- }
- } else {
- panels[region].panel('close');
- }
- if(doResize){
- $(dom).layout('resize');
- }
- };
- if(region.toLowerCase() == 'all'){
- hide(this,'east',false);
- hide(this,'north',false);
- hide(this,'west',false);
- hide(this,'south',true);
- }else{
- hide(this,region,true);
- }
- });
- },
- /**
- * 显示某个region,center除外。
- * @param {Object} jq
- * @param {Object} params
- */
- show: function(jq, params) {
- return jq.each(function() {
- var opts = $.data(this, 'layout').options;
- var panels = $.data(this, 'layout').panels;
- var region = params;
- function show(dom,region,doResize){
- var first = region.substring(0,1);
- var others = region.substring(1);
- var expand = 'expand' + first.toUpperCase() + others;
- if(panels[expand]) {
- if(!$(dom).layout('isVisible', expand)) {
- if(!$(dom).layout('isVisible', region)) {
- if(opts.regionState[region] == 1) {
- panels[expand].panel('open');
- } else {
- panels[region].panel('open');
- }
- }
- }
- } else {
- panels[region].panel('open');
- }
- if(doResize){
- $(dom).layout('resize');
- }
- };
- if(region.toLowerCase() == 'all'){
- show(this,'east',false);
- show(this,'north',false);
- show(this,'west',false);
- show(this,'south',true);
- }else{
- show(this,region,true);
- }
- });
- }
- });
- $('#id').layout('hidden','north');
- $('#id').layout('show','north');
EasyUI整合篇的更多相关文章
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(六)maven整合SSM
写在前面的话 承接前文<Spring+SpringMVC+MyBatis+easyUI整合基础篇(五)讲一下maven>,本篇所讲述的是如何使用maven与原ssm项目整合,使得一个普 ...
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(八)mysql中文查询bug修复
写在前面的话 在测试搜索时出现的问题,mysql通过中文查询条件搜索不出数据,但是英文和数字可以搜索到记录,中文无返回记录.本文就是写一下发现问题的过程及解决方法.此bug在第一个项目中点这里还存在, ...
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(十一)SVN服务器进阶
日常啰嗦 上一篇文章<Spring+SpringMVC+MyBatis+easyUI整合基础篇(十)SVN搭建>简单的讲了一下SVN服务器的搭建,并没有详细的介绍配置文件及一些复杂的功能, ...
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(十二)阶段总结
不知不觉,已经到了基础篇的收尾阶段了,看着前面的十几篇文章,真的有点不敢相信,自己竟然真的坚持了下来,虽然过程中也有过懒散和焦虑,不过结果还是自己所希望的,克服了很多的问题,将自己的作品展现出来,也发 ...
- Spring+SpringMVC+MyBatis+easyUI整合优化篇(二)Log4j讲解与整合
日常啰嗦 上一篇文章主要讲述了一下syso和Log间的一些区别与比较,重点是在项目的日志功能上,因此,承接前文<Spring+SpringMVC+MyBatis+easyUI整合优化篇(一)Sy ...
- Spring+SpringMVC+MyBatis+easyUI整合优化篇(四)单元测试实例
日常啰嗦 前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(三)代码测试>讲了不为和不能两个状态,针对不为,只能自己调整心态了,而对于不能,本文会结合一 ...
- Spring+SpringMVC+MyBatis+easyUI整合优化篇(五)结合MockMvc进行服务端的单元测试
日常啰嗦 承接前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(四)单元测试实例>,已经讲解了dao层和service层的单元测试,还有控制器这层也不能 ...
- Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合
日常啰嗦 本来这一篇和接下来的几篇是打算讲一下JDBC和数据库优化的,但是最近很多朋友加我好友也讨论了一些问题,我发现大家似乎都是拿这个项目作为练手项目,作为脚手架来用的,因此呢,改变了一下思路,JD ...
- Spring+SpringMVC+MyBatis+easyUI整合优化篇(七)图片上传功能
日常啰嗦 前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合>讲了富文本编辑器UEditor的整合与使用 ...
随机推荐
- VS Code常用快捷键大全
常用 General 按 Press 功能 Function Ctrl + Shift + P,F1 显示命令面板 Show Command Palette Ctrl + P 快速打开 Quick O ...
- js 学习之路10:try异常处理和第一个js小程序
try 语句测试代码块的错误. catch 语句处理错误. throw 语句创建自定义错误. 1. try/catch语句 catch语句用来捕获try代码块中的错误,并执行自定义的语句来处理它. 语 ...
- Centos7上安装单机版redis
Centos 7 上安装单机版redis Redis 官网下载 https://redis.io/download 1. 下载.解压.安装 cd /usr/local #wget http://dow ...
- PHP 函数漏洞总结
1.MD5 compare漏洞 PHP在处理哈希字符串时,会利用"!="或"=="来对哈希值进行比较,它把每一个以"0E"开头的哈希值都解释 ...
- 剑指offer:调整数组顺序使奇数位于偶数前面
题目 输入一个整数数组,实现一个函数来调整该数组中数字的顺序,使得所有奇数位于数组的前半部分,所有偶数位于数组的后半部分. 分析 事实上,这个题比较简单,很多种方式都可以实现,但是其时间复杂度或空间复 ...
- 把python学的让自己成为智障的day14
智障的第14天,今天还是装饰器,这也是这个难点,装饰器也是函数的其中一种,所以需要有返回值才能返回到之后要执行的函数中,当然,作为函数可以在其中带上参数,装饰器只是比较特殊,自然也可以带参数,目前来说 ...
- html与ios交互方法 WebViewJavascriptBridge
WebViewJavascriptBridge 1.html调用ios的方法 <!DOCTYPE html> <html lang="en"> <he ...
- Oracle完全卸载详解
Oracle数据库的安装这里就不说了,网上应该有很多,但是oracle数据库的卸载却找不到一个比较详细的完整卸载的说明.很多卸载不完全,会有遗留数据,影响后续的安装.所以自己整理一份以前上学的时候学习 ...
- CRM销售人员针对的客户的权重分配的思想
巧妙使用权重http://www.ziawang.com/article/52/ Django 项目CRM总结 - Pythia丶陌乐 - 博客园https://www.cnblogs.com/sup ...
- laravel 定义翻译字符串
https://learnku.com/docs/laravel/5.6/localization/1376 // 全景链接$data['share_phone'] = trans('web.host ...