easyui 下拉框点击ajax后台json数据 实时刷新 小鱼儿 2022-06-14 01:11 90阅读 0赞 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <%@include file="../../webapp/includes/config.jsp"%> <title>员工添加</title> <script type="text/javascript"> $(function() \{ $("\#position").combobox(\{ url:'../employee/toEmployeePostPage.do', valueField:'postName', textField:'postName', onShowPanel:function()\{ $(this).combobox('reload','../employee/toEmployeePostPage.do'); \} \}); $("\#dept").combobox(\{ url:'../employee/toEmployeeDeptPage.do', valueField:'deptName', textField:'deptName', onShowPanel:function()\{ $(this).combobox('reload','../employee/toEmployeeDeptPage.do') \} \}); $('<iframe frameborder="0" id="unitDlg" name="customersIframe" src="../customers/toCustomersListForDialog.do"/>').dialog(\{ closed:true, title: '请选择客户', resizable: true, height: 460, width: 600, modal: true, buttons:\[ \{text:'确定',handler:function()\{ var cName = window.document.getElementById("unitDlg").contentWindow.document.getElementById("hCName").value; $("\#eCName").textbox("setValue", cName); $('\#unitDlg').dialog('close'); \} \}, \{text:'取消',handler:function()\{$('\#unitDlg').dialog('close')\}\} \] \}); $("\#openUnitDlg").click(function() \{ $('\#unitDlg').dialog('open'); document.getElementById("unitDlg").contentDocument.location.reload(); \}); $("\#employeeEdit").click(function() \{ var eName = $("\#eName").val(); if (eName == "") \{ $.messager.alert("系统提示", "员工姓名不能为空!"); return; \} else \{ var age = $("\#age").val(); if ($.trim(age) != "") \{ if (age.length > 2 || age < 14) \{ $.messager.alert("系统提示","请输入正确的员工年龄!"); return; \} \} var ePhone = $("\#ePhone").val(); if ($.trim(ePhone) != "") \{ if (ePhone.length < 11 || ePhone.length > 11) \{ $.messager.alert("系统提示","请输入正确的手机号码!"); return; \} \} var wYears = $("\#wYears").val(); if ($.trim(wYears) != "") \{ if (wYears < 0 || wYears > 50) \{ $.messager.alert("系统提示","请输入正确的工作年限!"); return; \} \} var mail = $("\#mail").val(); if (mail != "") \{ var reg =/^\\w+(\[-+.\]\\w+)\*@\\w+(\[-.\]\\w+)\*\\.\\w+(\[-.\]\\w+)\*$/; if (!reg.test(mail)) \{ $.messager.alert("系统提示","请输入正确的邮箱!"); return; \} \} $("\#employeeAddForm").attr("action","../employee/employeeEdit.do").submit(); \} \}); \}); $(function()\{ var currTime=new Date(); var strDate=currTime.getFullYear()+"-"+(currTime.getMonth()+1)+"-01"; $('\#workBeginDate').datebox(\{formatter:function(date)\{ var y = date.getFullYear(); var m = date.getMonth() + 1; m = m < 10 ? '0' + m : m; return y.toString() + '-' + m.toString(); \},parser:function(date)\{ console.log(date); if (date) \{ return new Date(String(date).substring(0, 4) + '-' + String(date).substring(5,7)); \} else \{ return new Date(); \} \}\}); $('\#workBeginDate').datebox('setValue',strDate);//默认加载当前月份 \}); </script> </head> <body class="easyui-layout"> <div class="easyui-panel" title="员工管理/员工添加" style="width: 100%"> <div style="padding: 10px 60px 20px 60px"> <form id="employeeAddForm" method="post" > <input type="hidden" id="empId" name="empId" value="$\{emp.empId\}"> <center> <table cellpadding="5" width="650px" border="1"> <tr > <td rowspan="5" style="width: 20px">基本信息</td> <td><center>姓名:</center></td> <td> <input class="easyui-textbox" type="text" name="eName" id="eName" value="$\{emp.eName\}" style="width: 150px ;"/> </td> <td><center>性别:</center></td> <td> <center> 男<input type="radio" name="sex" value="1" <c:if test="$\{emp.sex=='1'\}">checked="checked"</c:if> /> 女<input type="radio" name="sex" value="2" <c:if test="$\{emp.sex=='2'\}">checked="checked"</c:if>/> </center> </td> </tr> <tr> <td><center>年龄:</center></td> <td> <input class="easyui-numberbox" type="text" name="age" id="age" value="$\{emp.age\}" style="width: 150px;"/> </td> <td><center>出生日期:</center></td> <td> <input class="easyui-datebox" type="text" name="birthdate" id="birthdate" value="$\{emp.birthdate\}" style="width: 150px;" /> </td> </tr> <tr> <td><center>身份证号:</center></td> <td > <input class="easyui-textbox" name="idCard" id="idCard" value="$\{emp.idCard\}" style="width: 150px;"> </td> <td><center>邮箱:</center></td> <td> <input class="easyui-textbox" type="text" name="mail" id="mail" value="$\{emp.mail\}" style="width: 150px;"/> </td> </tr> <tr> <td><center>家庭住址</center></td> <td colspan="3"> <input class="easyui-textbox" name="hAddress" id="hAddress" value="$\{emp.hAddress\}" style="width: 450px;"> </td> </tr> <tr> <td><center>婚姻状况</center></td> <td> <select class="easyui-combobox" name="mStatus" id="mStatus" style="width: 150px;"> <option value="">----请选择婚姻状况----</option> <option value="1" <c:if test="$\{emp.mStatus=='1'\}">selected="selected"</c:if> >未婚</option> <option value="2" <c:if test="$\{emp.mStatus=='2'\}">selected="selected"</c:if> >已婚</option> <option value="3" <c:if test="$\{emp.mStatus=='3'\}">selected="selected"</c:if> >其他</option> </select> </td> <td><center>联系电话:</center></td> <td> <input class="easyui-numberbox" type="text" name="ePhone" value="$\{emp.ePhone\}" id="ePhone" style="width: 150px;"/> </td> </tr> <tr> <td rowspan="4">工作信息</td> <td><center>开始工作年月:</center></td> <td> <input class="easyui-datebox" type="text" name="workBeginDate" id="workBeginDate" value="$\{emp.workBeginDate\}" style="width: 150px;" data-options="sharedCalendar:'\#cc'"/> </td> <td><center>入职日期:</center></td> <td> <input class="easyui-datebox" type="text" name="hireDate" id="hireDate" style="width: 150px;" value="$\{emp.hireDate\}" data-options="sharedCalendar:'\#cc'"/> </td> </tr> <tr> <td><center>离职日期:</center></td> <td> <input class="easyui-datebox" type="text" name="leaveDate" id="leaveDate" value="$\{emp.leaveDate\}" style="width: 150px;" data-options="sharedCalendar:'\#cc'"/> </td> <td><center>在职状态</center></td> <td> <select class="easyui-combobox" name="incumbency" id="incumbency" style="width: 150px;"> <option value="">----请选择在职状态---- </option> <option value="1" <c:if test="$\{emp.incumbency == '1'\}"> selected="selected" </c:if>>实习</option> <option value="2" <c:if test="$\{emp.incumbency == '2'\}"> selected="selected" </c:if>>出差</option> <option value="3" <c:if test="$\{emp.incumbency == '3'\}"> selected="selected" </c:if>>请假</option> <option value="4" <c:if test="$\{emp.incumbency == '4'\}"> selected="selected" </c:if>>离职未办</option> <option value="5" <c:if test="$\{emp.incumbency == '5'\}"> selected="selected" </c:if>>已离职</option> <option value="6" <c:if test="$\{emp.incumbency == '6'\}"> selected="selected" </c:if>>在职</option> </select> <!-- <input class="easyui-textbox" name="position" id="position" style="width: 150px;"> --> </td> </tr> <tr> <td><center>职位</center></td> <td> <!-- <input id="position" name="position" value="$\{emp.position\} " ></input> 可以直接写这个 只要id对了默认变成下拉框 --> <%-- <select class="easyui-combobox" name="dept" id="dept" style="width: 150px;"> <option value="">----请选择部门---- </option> <c:forEach items="$\{deps\}" var="dep"> <option value="$\{dep.deptName\}" <c:if test="$\{dep.deptName==emp.dept\}">selected="selected"</c:if> >$\{dep.deptName\}</option> </c:forEach> </select> </td> <td><center>职位</center></td> <td> <select class="easyui-combobox" name="position" id="position" style="width: 150px;"> <option value="">----请选择职位---- </option> <c:forEach items="$\{poss\}" var="pos"> <option value="$\{pos.postName\}" <c:if test="$\{pos.postName==emp.position\}">selected="selected"</c:if> >$\{pos.postName\}</option> </c:forEach> </select> --%> </td> </tr> <tr> <td><center>所在公司</center></td> <td colspan="3" > <input class="easyui-textbox" type="text" name="eCName" id="eCName" value="$\{emp.eCName\}" /> <a href="javascript:void(0)" class="easyui-linkbutton" id="openUnitDlg">..</a> </td> </tr> <tr> <td rowspan="3">受教育信息</td> <td><center>毕业院校</center></td> <td> <input class="easyui-textbox" name="gSchool" value="$\{emp.gSchool\}" id="gSchool" style="width: 150px;"> </td> <td><center>专业</center></td> <td> <input class="easyui-textbox" name="major" value="$\{emp.major\}" id="major" style="width: 150px;"> </td> </tr> <tr> <td><center>学历</center></td> <td> <select class="easyui-combobox" name="education" id="education" style="width: 150px;"> <option value="">----请选择学历---- </option> <option value="1" <c:if test="$\{emp.education == '1'\}"> selected="selected" </c:if>>高中/中专</option> <option value="2" <c:if test="$\{emp.education == '2'\}"> selected="selected" </c:if>>大专</option> <option value="3" <c:if test="$\{emp.education == '3'\}"> selected="selected" </c:if>>本科</option> <option value="4" <c:if test="$\{emp.education == '4'\}"> selected="selected" </c:if>>研究生</option> </select> </td> <td><center>学位</center></td> <td> <select class="easyui-combobox" name="aDegree" id="aDegree" style="width: 150px;"> <option value="">----请选择学位---- </option> <option value="1" <c:if test="$\{emp.aDegree == '1'\}"> selected="selected" </c:if>>无</option> <option value="2" <c:if test="$\{emp.aDegree == '2'\}"> selected="selected" </c:if>>学士</option> <option value="3" <c:if test="$\{emp.aDegree == '3'\}"> selected="selected" </c:if>>硕士</option> <option value="4" <c:if test="$\{emp.aDegree == '4'\}"> selected="selected" </c:if>>博士</option> <option value="5" <c:if test="$\{emp.aDegree == '5'\}"> selected="selected" </c:if>>博士后</option> </select> </td> </tr> <tr> <td><center>获得证书</center></td> <td> <input class="easyui-textbox" name="certificate" value="$\{emp.certificate\}" id="certificate" style="width: 150px;"> </td> <td><center>个人技能</center></td> <td> <input class="easyui-textbox" name="personalSkill" value="$\{emp.personalSkill\}" id="personalSkill" style="width: 150px;"> </td> </tr> <tr> <td colspan="5"> <center> <a href="javascript:void(0)" data-options="iconCls:'icon-save'" class="easyui-linkbutton" id="employeeEdit">保存</a> </center> </td> </tr> </table> <div id="cc" class="easyui-calendar"></div> </center> </form> </div> </div> </body> </html>
还没有评论,来说两句吧...