當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

11、jeecg 笔记之界面常用整理 - 方便复制粘贴

發(fā)布時間：2023/12/10 编程问答 46 豆豆

生活随笔收集整理的這篇文章主要介紹了 11、jeecg 笔记之界面常用整理 - 方便复制粘贴小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

11、jeecg 筆記之界面常用整理 - 方便復(fù)制粘貼

1、datagrid 操作按鈕（按鈕樣式）

操作按鈕的顯示主要依賴于?<t:dgCol title="操作" field="opt"? ></t:dgCol> 標簽，如果沒有該標簽，下方即使加入也不顯示。 <t:dgCol title="操作" field="opt" width="100"></t:dgCol> <t:dgDelOpt title="刪除" url="myyCanvassMainController.do?doDel&id={id}" urlStyle="" urlclass="ace_button" urlfont="fa-trash-o"/> <t:dgFunOpt funname="canvassDetail(id)" title="題目維護" urlStyle="background-color:#1a7bb9;" urlclass="ace_button" urlfont="fa-calendar-o"></t:dgFunOpt> <t:dgFunOpt funname="canvassView(id,mcmName)" title="問卷查看" urlStyle="background-color:#1a7bb9;" urlclass="ace_button" urlfont="fa-eye"></t:dgFunOpt> <t:dgFunOpt funname="canvassPhone(id)" title="用戶列表" urlclass="ace_button" urlfont="fa-phone"></t:dgFunOpt>

顏色替換 urlStyle 屬性 background-color 值即可，示例：

紅色：urlStyle="background-color:#ec4758;" 藍色：urlStyle="background-color:#1a7bb9;"

2、datagrid?雙擊操作 onDbClick

雙擊操作主要實現(xiàn) datagrid 的 onDbClick 屬性，示例： <t:datagrid name="myyWorkOrderList" checkbox="true" onDblClick="goView" ...

js 中實現(xiàn) goView 方法。 function goView(rowIndex,rowData){ var title = " 工單查看 "; var url = "myyWorkOrderController.do?goView"; var id = "myyHighQueryList"; detail(title,url,id,"80%","100%"); }

3、datagrid?獲取選中行

var rows = $('#xxx').datagrid('getSelections'); 其中 xxx 為 datagrid 的 name 值 //判斷選中幾行 if (rows.length <= 0) {openTip("提示","至少勾選一筆需要調(diào)派的工單");return false; } //如果是單行的話，通常可能會用到 for 遍歷后拿到單行： rows[i].id // rows[i].id = 當前行的 filed = 'id' 的屬性值 var ids = []; var rows = $('#xxx').datagrid('getSelections');for ( var i = 0; i < rows.length; i++) {ids.push(rows[i].id); }

4、dialog 帶蒙版的彈窗（layer）

openTipfunction openTip(title,content){layer.open({title:title,content:content,icon:7,shade: 0.3,yes:function(index){layer.close(index);},btn:['確定','取消'],btn2:function(index){layer.close(index);}}); }

5、datagrid?點擊單行超鏈接彈窗操作

<t:dgCol title="工單號" popup="true" url="myyWorkOrderController.do?goView&id={id}" style="color:blue;font-color:blue;width:55px" field="mwoNo" query="true" queryMode="single" width="125"></t:dgCol>

6、datagrid?自定義字段樣式替換（formatjs）

列上需要加入的?formatterjs="xxx"?，示例：formatterjs="formatterTime" function formatterTime(value,row,index){//后臺傳過來的日期var limitTimeTD = new Date(Date.parse("${limitTimeDT}"));//辦結(jié)時限var mwoEstimatedProcessingTime = new Date().format('yyyy-MM-dd hh:mm:ss',value);//工單狀態(tài)var mwoWorkOrderStatus = row.mwoWorkOrderStatus;//當前時間var currentTime = new Date();if (value != null && value != '') {//辦結(jié)時限var dateEpt = new Date(Date.parse(mwoEstimatedProcessingTime));//已經(jīng)過期：辦結(jié)時限 > 當前日期的if(currentTime > dateEpt && mwoWorkOrderStatus == '1'){return '<span class="fa fa-info-circle" style="color:#e14f4f;"> </span>'+mwoEstimatedProcessingTime;//即將過期: 滿足工作日 > 辦結(jié)時限 > 當前日期的#;}else if(limitTimeTD > dateEpt && dateEpt > currentTime && mwoWorkOrderStatus == '1'){return '<span class="fa fa-info-circle" style="color:#ffa92a;"> </span>'+mwoEstimatedProcessingTime;}else{return ''+mwoEstimatedProcessingTime;}}return value; }

7、刷新 datagrid （reload + datagrid name + () ）

//重新刷新列表數(shù)據(jù) <t:datagrid name="MyList" checkbox="true" ... js 方法中只需要調(diào)用下方法即可，jeecg 已經(jīng)幫我們實現(xiàn)該方法了。

reloadMyList();

1、彈窗，使用系統(tǒng) curd.js?中的

function canvassView(id,mcmName){var title = "調(diào)查問卷明細";var url = "myyCanvassItemController.do?listInspectMainView&mciMcmId="+id+"&mcmName="+mcmName;var datagrid = "myyCanvassMainList";var height =window.top.document.body.offsetHeight-200;createdetailwindow(title,url,800,height);//兩者區(qū)別，input disablecreatewindow(title,url,800,height); }

2、彈窗，不帶確認按鈕 dialog

3、彈窗確認操作，帶蒙罩 layer.open

layer.open({title:'提示',content:'確定要刪除該附件嗎？',icon:7,shade: 0.3,yes:function(index){layer.close(index);},btn:['確定','取消'],btn1:function(index){//真實文件不做刪除 layer.close(index);},btn2:function(index){layer.close(index);} });

4、帶確定按鈕的彈窗 dialog

//var width = window.top.document.body.offsetWidth; var height =window.top.document.body.offsetHeight-200;$.dialog({content: 'url:myyCanvassItemController.do?listInspect&mciMcmId=${mcaMcmId}&id='+id+"&mcmName=${param.mcmName}",zIndex: getzIndex(),width:800,height:height,cache:false,title:'${param.mcmName}',//title:'民意問卷題目列表', button: [{name: "確定",callback: function(){//alert("aaa");iframe = this.iframe.contentWindow;saveObj();return false;},focus: true},{name: "關(guān)閉",callback: function(){//重新刷新列表數(shù)據(jù) reloadmyyCanvassPhoneList();return true;}}] });

5、ajax?快速復(fù)制

$.ajax({type : 'post',url : 'myyWorkOrderFileController.do?filedeal&isdel=1&fileId='+fileId,//請求數(shù)據(jù)的地址dataType : "json", //返回數(shù)據(jù)形式為jsonasync:true,success : function(result) {var success = result.success;if(success){$("#table"+tableId).remove();$.dialog.tips('操作成功', 2);}},error : function(errorMsg) {tip('操作失敗');} });

6、input?遍歷取值

$("input[name='fileName1']").each(function(j,item){var value = item.value; });

7、radio?或者 checkbox?獲取選擇

// radio 獲取選中的值 $('input[name="addType"]').change(function(){if($("input[name='addType']:checked").val() == 'add'){} });//問卷狀態(tài)選擇實現(xiàn)，checkbox 達到單選效果 $("input[name='mcaStatus']").each(function(){$(this).click(function(){if($(this).attr('checked')){$(':checkbox[type="checkbox"][name='+$(this).attr("name")+']').removeAttr('checked');$(this).attr('checked','checked');}}); }); <div style="margin: 35px 5px 10px 10px;float: left;" id="statusParent"><t:dictSelect field="mcaStatus" type="checkbox" typeGroupCode="phone_mcp_status" hasLabel="false"></t:dictSelect> <span style="display:-moz-inline-box;display:inline-block;margin-bottom:2px;text-align:justify;"><span style="vertical-align:middle;display:-moz-inline-box;display:inline-block;width: 90px;
　　　　　　text-align:right;text-overflow:ellipsis;-o-text-overflow:ellipsis; overflow: hidden;white-space:nowrap; " title="預(yù)約時間">預(yù)約時間：</span><input type="text" readonly="readonly" id="mcaAppointTime" name="mcaAppointTime" style="width: 140px" class="Wdate"
　　　　　　οnclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})"></span> </div>// 獲取 checkbox 選中的值，外層嵌套一個 div :checkbox var mcaStatus; $("#statusParent :checkbox[checked]").each(function(i){mcaStatus = $(this).val(); }); //alert(mcaStatus); if(!mcaStatus){openTip("提示","請勾選用戶問卷狀態(tài)");return false; }

8、$(document).ready 追加 select

$(document).ready(function (){

var eptHtml = '<span style="display:-moz-inline-box;display:inline-block;margin-bottom:2px;text-align:justify;">'+ '<span style="vertical-align:middle;display:-moz-inline-box;display:inline-block;width: 9
0px;text-align:right;text-overflow:ellipsis;-o-text-overflow:ellipsis; overflow: hidden;white-space:nowrap; "'+ '>辦結(jié)時限：</span>'+ '<select name="limitTime" width="120" style="width: 120px"> '+ '<option value="">-- 請選擇 --</option> '+ '<option value="1">我是選項一</option> '+ '<option value="2">我是選項二 </option>'+ '</select></span>'; $("select[name='mwoIsUrge']").after(eptHtml);

});

9、彈出 datagrid?部門選擇（ztree樹形式）

$("input[name='mwoSponsorOrganization']").click(function(){$.dialog.setting.zIndex = getzIndex();var orgIds = $("#orgIdsSponsorOrgId").val();$.dialog({content: 'url:departController.do?departSelect&orgIds='+orgIds, zIndex: getzIndex(), title: '組織機構(gòu)列表', lock: true, width: '400px', height: '450px', opacity: 0.4, button: [{name: '<t:mutiLang langKey="common.confirm"/>', callback: callbackDepartmentSelectSponsorOrg, focus: true},{name: '<t:mutiLang langKey="common.cancel"/>', callback: function (){}}]}).zindex(); });function callbackDepartmentSelectSponsorOrg(){var iframe = this.iframe.contentWindow;var treeObj = iframe.$.fn.zTree.getZTreeObj("departSelect");var nodes = treeObj.getCheckedNodes(true);// nodes 即為選擇得到的部門 idif(nodes.length>0){var ids='',names='';for(i=0;i<nodes.length;i++){var node = nodes[i];ids += node.id;names += node.name;}$("input[name='mwoSponsorOrganization']").val(names);$('#orgIdsSponsorOrgId').val(ids);} }

10、彈出 datagrid?人員選擇（彈出datagrid形式）

11、系統(tǒng)自帶的 DepartSelectTag ?部門選擇

<t:departSelect selectedNamesInputId="orgNames" selectedIdsInputId="orgIds"> </t:departSelect>

12、系統(tǒng)自帶的 UserSelectTag?人員選擇?

<t:userSelect title="用戶名稱" selectedNamesInputId="userNames" selectedIdsInputId="userIds" windowWidth="1000px" windowHeight="600px"> </t:userSelect>

13、choose?系統(tǒng)提供的彈窗（hiddenId：隱藏域的id、hiddenName：隱藏域的名稱、textname：用來展示信息、name：彈出窗的datagrid name）

14、文件下載（文件上傳搜索 webUpload）

function download(path){var url = "cgUploadController.do?showOrDownByurl&down=1&dbPath="+path;window.location.href = encodeURI(url); }

1、c:forEach、c:if 快速復(fù)制 (包含集合大小判斷)

<c:forEach items="${ myyWorkOrderFileList }" var="mwoFileEntity" varStatus="status">${status.index} 坐標 </c:forEach><c:if test="${fn:length(myyWorkOrderFileList) > 0 }"></c:if>

2、c:choose? java switch?語法（多條件）

<c:choose><c:when test="<boolean>">...</c:when><c:when test="<boolean>">...</c:when><c:otherwise>//都不符合...</c:otherwise> </c:choose>

3、c:set?快速復(fù)制

<c:set value="${ 值 }" var="mwoAttachmentList" />

4、ready function

$(document).ready(function (){});$(function(){});

5、定時器?setInterval

setInterval(function(){},2000);

6、webUpload?上傳按鈕

<t:webUploader name="fileName1" url="myyWorkOrderFileController.do?filedeal" bizType="mwoFile" auto="true" extensions="*"
buttonStyle="btn-green btn-S mb20"></t:webUploader>bizType 后臺代碼可以通過 request.getParement("bizType") 獲取;由于這種上傳方式對于新添加的數(shù)據(jù) 并不能直接關(guān)聯(lián)到上傳附件上，所以，我們在提交 form 之前做一個填充效果。 //填充附件 function fillInFile(){var value;$("input[name='fileName1']").each(function(j,item){if(value){value = item.value + "," + value;}else{value = item.value;}});$("#mwoAttachment").val(value); }系統(tǒng)中的 upload 替換成 webuploadfunction ImportXls() {var deal_url = "myyWorkdayManageController.do?importExcel";var data = encodeURIComponent(deal_url);$.dialog({content: 'url:myyWorkdayManageController.do?upload&deal_url='+data,zIndex: getzIndex(),cache:false,title:'導(dǎo)入工作日',button: [{name: "關(guān)閉",callback: function(){window.location.reload();return true;}}]});} --------------------------------------------------------------------------@RequestMapping(params = "upload") public ModelAndView upload(HttpServletRequest req) {String deal_url = URLDecoder.decode(req.getParameter("deal_url"));req.setAttribute("deal_url",deal_url);return new ModelAndView("common/upload/web_upload_excel"); }

1、AuthFilter?界面權(quán)限標簽（name 按鈕容器的id?非必須）

<t:authFilter/> 說明：將該標簽放在 JSP 頁面最底部即可，注意不要采用包含寫法。 控制精度：可控制表單片段的隱藏和禁用

2、HasPermissionTag?界面權(quán)限標簽（code? 頁面控件權(quán)限 code）

<t:hasPermission code="add"><input name="mobile" class="inputxt" value="${depart.mobile }"> </t:hasPermission> 注意：這是一個非的控制，code 匹配上，包含頁面片段將不顯示。 控制精度: 只能控制表單片段的隱藏（不區(qū)分隱藏和禁用） json打印對象 JSON.stringify()

導(dǎo)出、下載、模板下載（當前界面）

window.location.href =??encodeURI("myyWorkdayManageController.do?exportXls"); select取值[獲取選中] <t:dictSelect field="dealFinish" type="radio"? typeGroupCode="SF_10"? defaultVal="0" hasLabel="false"? title="不再辦理" ></t:dictSelect> $("input[name='dealFinish']:checked").val() == '1' -------------------------------------------------- var selectValue = $("select[name='mkbbType']").val(); $("select[name='mkbTypehid'] option").each(function(){????????????????? $("select[name='mkbType']").append("<option??value='"+$(this).val()+"'>"+$(this).text()+"</option>"); }); 補充：拿到 select?后，通過 val()?

select賦值[選中]

// 監(jiān)聽事件 $('input[name="mwoSatisfaction"]').change(function(){// 獲取當前選中的值if($("input[name='mwoSatisfaction']:checked").val() == '2'){}if($("input[name='mwoSatisfaction']:checked").val() != '2'){} });

redio去掉默認值，勾選指定值

去除選中項 $("input[name='mrServiceSatisfaction']:checked").prop("checked", false); 勾選第一個item選中項 $("[name='addType']:eq(0)").attr("checked",true); 移除指定第二個item選中項 $("[name='sex']:eq(1)").removeAttr("checked");

fmt格式化數(shù)值、保留小數(shù)位? ?在 jstl?中 div?表示?除法

<fmt:formatNumber type="number" value="${revisitList.jrate}" pattern="####.##" maxFractionDigits="2" />

format日期格式化：

<fmt:formatDate value="${myyWorkOrderPage.mwoReportingTime }" pattern="yyyy-MM-dd HH:mm:ss"/>

formatterjs自定義格式化

ifram取值、賦值

// 獲取某一個id控件 frameElement.api.opener.document.getElementById("mwopOperateRemarks");// 賦值 var mwopOperateRemarks = frameElement.api.opener.document.getElementById("mwopOperateRemarks"); mwopOperateRemarks.value = '123';// 獲取 js 定義的 var 屬性 frameElement.api.opener.document.xxx;// 關(guān)閉彈窗 frameElement.api.close();

博客地址：http://www.cnblogs.com/niceyoo posted @ 2019-02-11 20:13 niceyoo 閱讀(...) 評論(...) 編輯收藏

總結(jié)

以上是生活随笔為你收集整理的11、jeecg 笔记之界面常用整理 - 方便复制粘贴的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。

上一篇：马云正传——读书笔记
下一篇：计算机怎样双面打印,电脑双面打印机怎么打