jquery初始化元件
阿新 • • 發佈:2018-11-08
以easyui為例,初始化easyui元件
初始化列表元件
var _self = new ListView(); $(function () { var columns = [ {field:'ck',checkbox:true}, {field:'warnUser',title:'報警使用者',align:'center',sortable:true,width:240,formatter:function(value,row,index){ return $Core.DicCache.get("publicserviceName")[value]; }}, {field:'warnTime',title:'報警時間',align:'center',width:125}, {field:'warnAddress',title:'報警地址',align:'center',width:240}, {field:'accidentReason',title:'事故原因',align:'center',width:240,formatter:function(value,row,index){ return $Core.DicCache.get("warnReason")[value]; }}, ]; _self.listOption.idKey = "userWarnId"; _self.listOption.columns = columns; _self.listOption.url = "alter/warnAritifi"; _self.listOption.formurl = "WarnAritifiForm.html"; _self.listOption.dictCodes = "warnHandleState,warnReason,users,publicserviceName"; _self.listOption.searchform = "search_form"; _self.listOption.loadSuccess = function(){ }; _self.cusButtonEvents = function(){ }; _self.createCusView = function(){ }; _self.init(); _self.initControl = function () { var $btnQuery = $("#btnquery"); $("#dglist").datagrid({ url: _self.listOption.url+'/query', columns:[_self.listOption.columns], sortName:"warnTime", sortOrder:"desc", onBeforeLoad: function (paras) { var userName = $("#warnUserName").val(); var querystr = '[{"name":"marketingDepartment","value":"'+$Core.USER().OrgDataCode+'","type":"rlike"}]'; if (userName != null && userName != "") { querystr = '[{"name":"userName","value":"' + userName + '","type":"like"},' + '{"name":"marketingDepartment","value":"' + $Core.USER().OrgDataCode + '","type":"rlike"}' + ']'; } $.ajaxSettings.async = false; $.post("security/publicservicesuser/query",{"querystr":querystr},function(data) { var ids = ""; var list = data.data.rows; /*for (var i in list) { var id = list[i].id; ids += id; }*/ if (list != null && list.length > 0) { for(var i=0; i< list.length;i++) { if (i==0) { ids = ids +list[i].id; }else{ ids = ids + "," +list[i].id; } } } /*$("#warnUser").textbox("setValue",ids);*/ $("#warnUser").val(ids); }); $.ajaxSettings.async = true; var v = $Core.util.QueryFormSerializeString('search_form'); paras.querystr = v; }, onLoadSuccess: function () { $btnQuery.find("span").text("查詢"); $btnQuery.removeAttr("disabled", "disabled"); $btnQuery.find("i").attr("class", "glyphicon glyphicon-search"); }, onLoadError: function () { $btnQuery.find("span").text("查詢"); $btnQuery.removeAttr("disabled", "disabled"); $btnQuery.find("i").attr("class", "glyphicon glyphicon-search"); }, loadFilter: function (data) { return data.data; } }); } });
var ListView = function(){ var _this = null; var $btnQuery = null; var $btnadd = null; var $btnedit = null; var $btndel = null; var $btnreset = null; var $btnred = null; var $dg = null; var $search_form = null; var $url = null; var $formurl = null; var $id = null; var $initControl = null; var $del = null; var $query = null; var $add = null; var $getById = null; var $upd = null; this.dicurl = "system/dic/getDicByCode/"; this.cusButtonEvents = null; this.createCusView = null; this.listOption = { columns: null, query:null, getById:null, add:null, del:null, upd:null, idKey:null, buttons:["btnred","btnreset","btnquery","btnadd","btnedit","btndel"], dglist:"dglist", url:null, formurl:null, searchform:null, dictCodes:"" } this.btnQueryClick = function(e){ var $btn = $(this); $btn.find("span").text("查詢中.."); $btn.attr("disabled", "disabled"); $btn.find("i").attr("class", "fa fa-spin fa-refresh"); $dg.datagrid("load"); }; this.btnreset = function(e){ $(".search-table").form("clear"); }; this.btnAddClick = function(e, dom){ var url = $formurl+"?s=" + Math.random(), titleText = $(dom).find("i").attr("placeholder"), width = $(dom).find("i").attr("width"), height = $(dom).find("i").attr("height"); if(!titleText) titleText = "新增"; if(!width) { width = "50%"; } if(!height) { height = "90%" } $Core.UI.openDialog("addwind", url, { title: titleText, width: width, height: height, onClose: function () { $dg.datagrid("load"); } }); } this.init = function(){ _this = this; $id = this.listOption.idKey; $dg = $("#"+this.listOption.dglist); $url = this.listOption.url; $formurl = this.listOption.formurl; $search_form = $("#"+this.listOption.searchform); $del = this.listOption.del; $query = this.listOption.query; $upd = this.listOption.upd; $add = this.listOption.add; $getById = this.listOption.getById; $initControl = this.initControl(); $("body").append('<input id="cntenIdKey" type="hidden" value="'+$id+'"/>'); $("body").append('<input id="cntenUrl" type="hidden" value="'+$url+'"/>'); $("body").append('<input id="cntenUpd" type="hidden" value="'+$upd+'"/>'); $("body").append('<input id="cntenAdd" type="hidden" value="'+$add+'"/>'); $("body").append('<input id="cntenById" type="hidden" value="'+$getById+'"/>'); if(_this.createCusView){ _this.createCusView(); } //初始化按鈕 initButtonEvents(_this.listOption.buttons,_this.listOption.cusButtons); if (this.listOption.dictCodes==null || this.listOption.dictCodes == ""){ _this.initControl(); }else{ $Core.DicCache.initDictionary(this.listOption.dictCodes, function () { _this.initControl(); }); } $Core.OnPageLoad(function () { $Core.Loading.HidePageLoading(); }); };//init end var initButtonEvents = function(buttons){ //初始化預設按鈕 $.each(buttons,function(i,obj){ var btnHtml = '<button type="button" class="btn btn-primary" id="btnquery"><i class="glyphicon glyphicon-search"></i><span>查詢</span></button>'; if(obj=="btnquery"){ $btnQuery = $("#"+obj); }else if(obj=="btnadd"){ btnHtml = '<button type="button" class="btn btn-primary" id="btnadd"><i class="lyphicon glyphicon-plus"></i><span>新增</span></button>'; $btnadd = $("#"+obj);; }else if(obj=="btnedit"){ btnHtml = '<button type="button" class="btn btn-primary" id="btnedit"><i class="glyphicon glyphicon-edit"></i><span>修改</span></button>'; $btnedit = $("#"+obj);; }else if(obj=="btndel"){ btnHtml = '<button type="button" class="btn btn-primary" id="btndel"><i class="glyphicon glyphicon-trash"></i><span>刪除</span></button>'; $btndel = $("#"+obj); }else if(obj=="btnreset"){ btnHtml = '<button type="button" class="btn btn-primary" id="btndel"><i class="glyphicon glyphicon-refresh"></i><span>重置</span></button>'; $btnreset = $("#"+obj); }else if(obj=="btnred"){ btnHtml = '<button type="button" class="btn btn-primary" id="btndel"><i class="glyphicon glyphicon-refresh"></i><span>檢視</span></button>'; $btnred = $("#"+obj); } // $("#buttonDiv").append(btnHtml); }); $btnadd.click(function (e) { _this.btnAddClick(e, this); }); $btndel.click(function (e) { _this.btnDelClick(e); }); $btnQuery.click(function (e) { _this.btnQueryClick(e); }); $btnedit.click(function (e) { _this.btnEditClick(e, this); }); $btnreset.click(function (e) { _this.btnreset(e); }); $btnred.click(function (e) { _this.btnred(e, this); }); //初始化自定義按鈕 if(_this.cusButtonEvents){ _this.cusButtonEvents(); } }; this.initControl= function() { var IsCheckFlag = true; var url = $url+"/query"; if ($query != null && $query != ""){ url = $query; } $dg.datagrid({ url: url, checkOnSelect:false, columns:[_this.listOption.columns], idField: _this.listOption.idKey, onBeforeLoad: function (paras) { _this.beforeLoad(); var v = $Core.util.QueryFormSerializeString('search_form'); paras.querystr = v; }, onLoadSuccess: function () { $btnQuery.find("span").text("查詢"); $btnQuery.removeAttr("disabled", "disabled"); $btnQuery.find("i").attr("class", "glyphicon glyphicon-search"); if(_this.listOption && _this.listOption.loadSuccess) eval(_this.listOption.loadSuccess()); //點選選擇時資料回顯選中的行 var idstr = $.util.request[_this.listOption.idKey]; var idss = ""; if (idstr != null && idstr != "") idss = idstr.split(","); for (var i = 0; i < idss.length; i++) { var check = $dg.datagrid("getRowIndex", idss[i]); $dg.datagrid("checkRow", check); } }, onLoadError: function () { $btnQuery.find("span").text("查詢"); $btnQuery.removeAttr("disabled", "disabled"); $btnQuery.find("i").attr("class", "glyphicon glyphicon-search"); }, loadFilter: function (data) { return data.data; }, onClickRow: function (rowIndex, rowData) { $(this).datagrid('unselectRow', rowIndex); } }); };//initControl end this.beforeLoad = function () { } };