前端工具类集合，整合easyUI和extjs相关方法

最新推荐文章于 2022-03-10 17:19:52 发布
最新推荐文章于 2022-03-10 17:19:52 发布
阅读量358 收藏
点赞数
文章标签： extjs easyui 前端工具类 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010965170/article/details/78706809
版权
var common={
    loadMsgText:'正在加载数据...',
    basePath:''
     
};
//设置input组件宽度和父td宽度一样
common.setInput100Percent=function(id){
    var curInput$=$("#"+id);
    if(curInput$){
        curInput$.css("width",(curInput$.parent().width())+"px");
    }
}
//设置数字类型控件100展示
common.setNumberInput100Percent=function(id){
    var curInput$=$("#"+id);
    if(curInput$){
        curInput$.numberbox({
            width:(curInput$.parent().width()),
            height:35,
            border:false
        });
    }
    
}
//设置日期控件100%显示高度30
common.setDateInput100Percent=function(id){
    var curInput$=$("#"+id);
    if(curInput$){
        curInput$.datebox({
            width:(curInput$.parent().width()),
            height:35
        });
    }
}
//设置日期控件100%显示
common.setDateInput100Percent2=function(id){
    var curInput$=$("#"+id);
    if(curInput$){
        curInput$.datebox({
            width:(curInput$.parent().width())
        });
    }
}
//设置下拉框100%显示
common.setCombobox100Percent=function(id,height){
    var curInput$=$("#"+id);
    if(!height){
        height=35;
    }
    if(curInput$){
        if(height){
            curInput$.combobox({
                width:(curInput$.parent().width()),
                height:height
            });
        }else{
            curInput$.combobox({
                width:(curInput$.parent().width())
            });
        }
        
    }
}
common.setComTree100Percent=function(id,height){
    var curInput$=$("#"+id);
    if(!height){
        height=35;
    }
    if(curInput$){
        if(height){
            curInput$.combotree({
                width:(curInput$.parent().width()),
                height:height
            });
        }else{
            curInput$.combotree({
                width:(curInput$.parent().width())
            });
        }
        
    }
}
//判断普通文本控件是否为空 是true,否false (有值)
common.isNullOrEmpty=function(id){
    if($("#"+id)){
        if($("#"+id).val()){
            return false;
        }
    }
    return true;
}
//判断下拉框选择值是否为空是true 否false
//id（组件id）
common.isComboxNullOrEmpty=function(id){
    if($("#"+id)){
        if($("#"+id).combobox('getValue')){
        return false;
        }
    }
    return true;
}
//弹出框
common.alert=function(messageStr){
    $.messager.alert('提示',messageStr); 
}
//提示框 可执行方法
common.alertFun=function(messageStr,fun){
    $.messager.alert('提示',messageStr,null,function(){
        fun();
    });   
}
//进度条
common.progress=function(messageStr){
    $.messager.progress({title:'提示',msg:messageStr});
}
common.progressClose=function(){
    $.messager.progress('close');
}
//左下角弹出框默认两秒
common.showAlert=function(messageStr,second){
    if(!second){
        second=2000;
    }
     $.messager.show({
        title:'提示',
        msg:messageStr,
        timeout:second,
        showType:'slide'
    });
}
//给数字类型控件赋值
common.setNumberInputValue=function(id,data){
    var c_data="";
    if(data&&(data[id]||data[id]==0)){
        c_data=data[id];
    }
    if($("#"+id)){
        $("#"+id).numberbox('setValue',c_data);
    }
}
common.setNumberInputValue2=function(id,data){
    var c_data="";
    if(data){
        c_data=data;
    }
    if($("#"+id)){
        $("#"+id).numberbox('setValue',c_data);
    }
}
//给控件赋值
common.setInputValue=function(id,data){
    var c_data="";
    if(data&&data[id]){
        c_data=data[id];
    }
    if($("#"+id)){
        $("#"+id).val(c_data);
    }
}
common.setInputValue2=function(id,data){
    var c_data="";
    if(data ){
        c_data=data;
    }
    if($("#"+id)){
        $("#"+id).val(c_data);
    }
}
//给下拉控件赋值
// id（控件id）data(对象)
common.setComboxValue=function(id,data){
    var c_data="";
    if(data&&data[id]){
        c_data=data[id];
    }
    if($("#"+id)){
        $("#"+id).combobox('setValue',c_data);
    }
}
//给下拉框树赋值
common.setComtreeValue=function(id,data){
    var c_data="";
    if(data&&data[id]){
        c_data=data[id];
    }
    if($("#"+id)){
        $("#"+id).combotree('setValue',c_data);
    }
}
//给日期控件赋值
// id（控件id）data(对象)
common.setDateValue=function(id,data){
    var c_data="";
    if(data&&data[id]){
        c_data=DateUtil.dateToStr("yyyy-MM-dd",new Date(data[id]));
    }
    if($("#"+id)){
        $("#"+id).datebox('setValue',c_data);
    }
}
//给日期控件赋值 id(控件id) dateStr(格式2015-07-16)
common.setDateValue2=function(id,dateStr){
    var c_data="";
    if(dateStr){
        c_data=dateStr;
    }
    if($("#"+id)){
        $("#"+id).datebox('setValue',c_data);
    }
}
//设置下拉框本地数据
common.setLocalDicData=function(zjId,data){
    var $curZj=$("#"+zjId)
    if($curZj){
        $curZj.combobox({
        data:data,
        valueField:'sd_keyno',
        textField:'sd_value'
    });
    }
}
字典相关
//type=static 获取缓存数据
common.getDicData=function(id,type,other){
    var sData=$.ajax({
        url:common.getRootPath()+'/lpb/Bdcxmgl_getDicList.action',
        async:false,
        cache:false,
        data:{id:id,other:other,type:type}
    }).responseText;
    
    sData= eval(sData);
    return sData;
}
//字典异步
//主要用于一个页面初始化多个下拉组件
common.getDicDataSynFun=function(id,fun,type,other){
    $.ajax({
        url:common.getRootPath()+'/lpb/Bdcxmgl_getDicList.action',
        cache:false,
        data:{id:id,other:other,type:type},
        dataType:'json',
        success:function(data){
            fun(data);
        }
    });
}
//获取字典值异步
//字典id,other(其它条件),zjId(组件id)
common.getDicDataSyn=function(zjId,id,other){
    var sData=$.ajax({
        url:common.getRootPath()+'/lpb/Bdcxmgl_getDicList.action',
        async:true,
        cache:false,
        dataType:'json',
        data:{id:id,other:other,type:'static'},
        success:function(data){
            var $curZj=$("#"+zjId)
            if($curZj){
                $curZj.combobox({
                data:data,
                valueField:'sd_keyno',
                textField:'sd_value'
            });
            }
        }
    });
}
common.getDicDataFwyt=function(){
    var sData=$.ajax({
        url:common.basePath+'/lpb/Bdcxmdz_getFwytJSON.action',
        async:false,
        cache:false
    }).responseText;
    
    sData= eval(sData);
    return sData;
}
//获取路径
common.getRootPath=function(){
    var curWWWpath=window.document.location.href;
    var pathName=window.document.location.pathname;
    var pos=curWWWpath.indexOf(pathName);
    var localhostPath=curWWWpath.substring(0,pos);
    var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1);
    return (localhostPath+projectName);
}
common.basePath=common.getRootPath();
//根据value获取控件值
common.getTextByValue=function(id,value){
    var cData=common.getDicData(id);
    var cTextStr="";
    for(var i=0,len=cData.length;i<len;i++){
        if(value==cData[i].sd_keyno){
            cTextStr=cData[i].sd_value;
            break;
        }
    }
    return cTextStr;
}
//cData 字典数据value 值
common.getTextByValue2=function(cData,value){
    var cTextStr="";
    for(var i=0,len=cData.length;i<len;i++){
        if(value==cData[i].sd_keyno){
            cTextStr=cData[i].sd_value;
            break;
        }
    }
    return cTextStr;
}
//获取url参数
common.getUrlParam=function(name) {
     var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
     var r = window.location.search.substr(1).match(reg);  //匹配目标参数
     if (r != null) return unescape(r[2]); return null; //返回参数值
}
//判断是否为正确的日期
common.isRightDate=function(id){
    var cdate=$("#"+id);
    if(cdate){
        var cDateValue=cdate.datebox('getValue');
        if(DateUtil.isDate(cDateValue,'yyyy-MM-dd')){
            return true
        }
    }
    return false;
}
//用ext打开页面
common.openForm=function(obj){
    var win=new parent.top.Ext.Window({
        title:obj.title,
        id:obj.id,
        width:obj.width,
        height:obj.height,
        modal: true,
        layout: 'fit',
        html: '<iframe   src="'+obj.url+'" style="width:100%;height:100%; border:0px;"></iframe>'
    });
    win.show();
}
//关闭Ext window
common.closeForm=function(id){
    debugger
    var curForm=parent.top.Ext.getCmp(id);
    if(null!=curForm){
        try{
            curForm.close();
        }catch(e){
            alert(e);
        }
    }
}
//获取上级页面。
common.getTopDocument=function(){
    var topWin=parent.top.$("#mainiframe");
    if(topWin&&topWin.length>0){
        var topDocument=topWin[0].contentWindow;
        return topDocument;
    }else{
        return parent;
    }
}
//格式化户号自然幢号
common.formaterHH=function(value){
     if(value.length==1){
        return '000'+value
     }else if(value.length==2){
        return '00'+value
    }else if(value.length==3){
        return '0'+value;
    }
    if(value.length>4){
        return value.substring(0,4);
    }
    
    return value;
}
三味线的铲屎官
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
easyui,extjs图标icon图标大全
12-31
icon图标大全(2000个icon),适用于easyui,extjs等,可适用各种信息系统开发
webUI框架miniUI,easyUI,extJS,Bootstrap简介及简单部署
bxwbxw555的博客
01-04 6830
jQuery MiniUI 前端WebUI控件库 jQuery MiniUI - 专业WebUI控件库。使用MiniUI，开发者可以快速创建Ajax无刷新、B/S快速录入数据、CRUD、Master-Detail、菜单工具栏、弹出面板、布局导航、数据验证、分页表格、树、树形表格等典型WEB应用系统界面。 本文为大家讲解的是webUI框架miniUI,easyUI,e
ExtJs引入js和Easyui引入js
u012365843的专栏
07-12 2800
因为经常用EasyUI习惯啦，现在学习用ExtJs，常常将EasyUI的东西写到ExtJs中。为了不犯低级错误，我归类一下自己常错的地方，说不上你也中招啦！ 我们知道HTML  onload的作用是页面加载完成后执行的动作，那么EasyUI如何实现呢，$(function(){ 要执行的函数主体 }); EtJs又是如何实现的呢，Ext.onReady(function(){ 要执行的函数主
ExtJS与JQuery对比
chenmoquan的专栏
08-19 1万+
首先分别介绍一下ExtJS和JQuery，然后进行对比分析 一、什么是ExtJS？ 1、ExtJS可以用来开发RIA也即富客户端的AJAX应用，是一个用javascript写的，主要用于创建前端用户界面，是一个与后台技术无关的前端ajax框架。因此，可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。ExtJs最开始基于YUI技术，由开发人员JackSlo
bootstrap、jquery easyui、extjs界面比较
热门推荐
ouyida3的专栏
03-03 2万+
最近需要做一个界面，有下拉选择框、按钮、表格。 之前用过jquery ui，样子还凑合，但是很大的一个问题是没有表格。
easyUI和extJS插件和使用说明
06-08
内容 1. 拖放 o 基本拖放 o 创建购物车式拖放 o 创建课程表 o 等等 基本拖放 ...这个例子会创建3个DIV元素然后让它们变得可拖放。 ...首先，创建三个DIV元素： <div id="dd1" class="dd-demo"></div> ...
适用于easyui,extjs等的 200 个 icon图标大全(2000个icon)
03-06
适用于easyui,extjs等的 200 个 icon图标大全(2000个icon)。 icon图标大全(2000个icon),适用于easyui,extjs等,可适用各种信息系统开发 easyui,icon
jQuery EasyUI仿Extjs界面
03-30
jQuery EasyUI 仿 Extjs 界面布局，左边手风琴折叠菜单。点击菜单在右边content区域可增加tab标签，可作为项目的main页
jQuery EasyUI 开源插件套装 完全替代ExtJS
10-29
JQuery爱好者们的福音 jQuery EasyUI 开源插件套装 完全替代ExtJS(引用)
jQuery EasyUI仿Extjs漂亮界面实例演示
09-13
推荐jQuery EasyUI仿Extjs漂亮界面实例演示
Angular Vue Easy UI ExtJS前端视频教程
03-15
Angular Vue Easy UI ExtJS前端框架视频教程
extjs easyui小图标
03-04
extjs easyui小图标
easyui+增强窗体 demo_ext为实例文件
01-29
2016-1-31 更新 1、使用时不再需要显示调用followCustomHandle方法，即可生效扩展属性。 2013-9-3 更新 1、$.showWindow 和 $.showModalDialog 在useiframe=true时，对窗体body增加遮罩控制。 2、easyui.tabs的add方法当useiframe=true时，增加遮罩控制。 3、toolbar增加url属性，可以通过请求后台数据构建。 4、增加mask（遮罩）扩展。 2013-8-26 更新 1、tree增加支持类标准数据格式加载，具体看demo或jquery.easyui.tree.extend.js文件开头说明。 2、修复datagrid在rowediting编辑风格时点击“确定”按钮无法提交问题。 3、datagrid和treegrid增加getEditingRows方法，用来获取所有正在编辑的行。 4、修复tabs.add方法，当useiframe=true时, iframe的高度改为100%。 5、修复当tabs使用iframe时，右键菜单刷新报错问题。 6、增加combotree对简单数据格式和类标准数据格式的加载，具体参考jquery.easyui.tree.extend.js文件开头说明。 7、修复datagrid.onConfirmEdit事件默认实现bug。 8、增加treegrid.onConfirmEdit事件。 2013-8-12 更新 1、修复combobox在级联操作时，传递的swd参数值为null，而不是选中值。 2、datagrid的addEventListener 方法增加对事件onExpandRow和onCollapseRow的控制。 3、tree增加自定义属性 attributes，用于简单数据加载时，指定那些字段当作node的attributes属性使用。 4、combobox增加 getSelected 方法， 返回选中item的data值。 5、combogrid增加 getSelected 方法，返回选中item的data值。 6、datagrid增加 getAllExpandRowIndex 方法，用于在detailView视图下获取当前页已展开行的索引。 7、datagrid增加 getExpandRowIndex 方法，用于在detailView视图下获取当前页第一个展开行的索引。 8、datagrid增加 fixDetailRowWidth 方法，用于detailView视图下修改rowDetial中组件宽度。 9、getAllExpandRowIndex、getExpandRowIndex、fixDetailRowWidth 这三个方法联合使用可解决detailView视图下列拖拽时显示错位问题。 10、修复datagrid 的rowEditing编辑风格在没有数据的datagrid中增加数据后，再编辑时无法显示的问题。 11、datagrid增加自定义事件 onConfirmEdit , 用于rowEditing编辑风格点击“确定”按钮时触发。当事件返回false时终止endEdit方法调用。 2013-7-31 更新 1、$.showWindow、$.showModalDialog 这两个方法增加返回值，返回值指向当前弹出窗的引用。 2、移除根据$.browser.msie判断浏览器版本。 2013-7-18 更新 1、menu、datagrid、combo、combobox、panel、tabs、tree、treegrid 增加 addEventListener 方法。 2、修复menu、datagrid、combo、combobox、panel、tabs、tree、treegrid 因事件注册造成多次重复渲染的问题（包括多次请求后台数据）。 3、移除datagrid 的rowContextMenu菜单项默认事件替换功能。 4、删除datagrid rowContextMenu默认菜单中的增加、编辑、导出菜单项。
EXT项目中引用Vue框架开发
zhou13528482267的博客
10-26 1455
1、创建导航按钮。（修改web\-WebService\Profile\InitializeService.xml 文件）； <item uid="test-demo" text="测试页面" iconCls="" funcClass="TestDemoView"></item> 2、创建控制器和视图文件。（分别在web\app\controller 文件夹下和web\app\view\funcpage文件夹下加） /** * @description 账户设置 * .
EasyUI和extjs
步步为赢的专栏
06-20 7131
一：jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。asyui 是一个基于 jQuery 的框架，集成了各种用户界面插件。 二：开发者不需要编写复杂的javascript，也不需要对css样式有深入的了解，开发者需要了解的只有一些简单的html标签。 三：easyui和extjs哪个容易学，哪个功能强大？  1 首先JQuery-
11.封装vue组件
weixin_43596108的博客
03-10 1580
封装vue组件 首先创建一个自定义组件的文件夹custom(名字自取),里面包含一个index.js文件，用于向外抛出其里面的组件,目录结构如下所示： 然后在该文件夹下创建包含组件并在里面创建一个index.js文件，用于向外抛出该组件，组件需要添加name属性，这样外界就可以根据name属性调用该组件，文件夹的目录如下： custom{ map{ map.vue index.js } index.js } 编辑map文件夹下的in
基于easyui的通用导出
11-30
本代码主要针对easyui 的数据网格导出, 通过节点自动识别导出
easyui datagrid前端分页如何实现
最新发布
05-30
EasyUI Datagrid前端分页可以通过以下步骤实现： 1. 设置分页相关参数 在Datagrid的初始化代码中，设置以下分页相关参数： ``` pagination: true, // 启用分页 pageSize: 10, // 每页显示的记录数 pageList: [10,...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值