easyui 下拉框点击ajax后台json数据 实时刷新

最新推荐文章于 2024-04-22 18:41:55 发布
最新推荐文章于 2024-04-22 18:41:55 发布
阅读量3.3k 收藏
点赞数
文章标签： java maven easyui ajax 数据
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36949713/article/details/72875326
版权
<%@ 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> />&nbsp;&nbsp;&nbsp;
                                  女<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>
wcy10086
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ajax请求后台得到json数据后动态生成树形下拉框的方法
01-21
如下所示： <select id=cc class=easyui-combotree style=width:580px; name=rempId data-options=required:true></select> [removed] $(function(){ $.ajax({ url:departmentAction_getAllDep.action, type:post, success:function(result){ //console.log(result); $(#cc).combotree('loadData',b1(result))
EasyUI ComboBox（下拉列表框）
anzy/pine的博客
07-22 1万+
ComboBox（下拉列表框） 扩展自$.fn.combo.defaults。使用$.fn.combobox.defaults重写默认值对象。 下拉列表框显示一个可编辑文本框和下拉式列表，用户可以选择一个值或多个值。用户可以直接输入文本到列表顶部或选择一个或多个当前列表中的值。 依赖关系 combo 使用案例 通过元素创建一个预定义结构的下拉列表框。  i
EasyUI ComboBox（下拉列表框）通过url加载调用远程数据并实时刷新
筱洁的博客
08-17 3636
EasyUI ComboBox（下拉列表框）通过url加载调用远程数据并实时刷新 首先,通过input标记创建组合框（combobox）。 <input class="easyui-combobox" type="text" name="字段名" data-options="valueField:'提交到后台的值',textField:'显示的远程数据库的值', url:'xxx', ed...
easyui下拉框赋值 ajax,easyui下拉框动态级联加载的示例代码
weixin_42404710的博客
08-06 290
easyui的下拉框动态加载数据，高校中要根据首先查询所有学院，然后根据学院动态加载课程。下面看如何实现。1.界面效果2. html + js代码学院名称：Box" style="width:30%;" id="collegeName">课程名称：Box" style="width:30%;" id="courseName">内容是动态查询数据库信息$('#collegeName')....
java提示框easyui风格_EasyUI 标签框风格(TagBox Style)_Vue EasyUI Demo
weixin_39705931的博客
02-13 131
源代码TagBox StylevalueField="id"textField="text"placeholder="Select a Language":limitToList="true":hasDownArrow="true":data="data":tagCss="tagCss">{{value}}export default {data() {return {value: ["3"...
jquery easyui TagBox with Autocomplete ajax请求方式自动填充
07-08
jquery easyui TagBox with Autocomplete ajax请求方式自动填充
easyui datagrid如何加载通过ajax获得的json格式的数据
sam111_222的专栏
03-12 8885
文章为转载，地址：http://www.xue163.com/588880/39097/390970679.html 为了帮助网友解决“easyui datagrid如何加载通”相关的问题，中国学网通过互联网对“easyui datagrid如何加载通”相关的解决方案进行了整理,用户详细问题包括:easyuidatagridajaxjson从ajax中获得了数据，然后怎么把多个json对象让
jquery easyui 使用 combobox动态加载数据
热门推荐
sd6275832ght的博客
11-12 1万+
首先引入相关js 和css &lt;link href="css/themes/default/easyui.css" rel="stylesheet" type="text/css" /&gt; &lt;link href="css/themes/icon.css" rel="stylesheet" type="text/css" /&gt;
EasyUI ComboGrid（数据表格下拉框）
qq_35798061的博客
08-05 1463
EasyUI
EasyUI的DataGrid绑定Json数据源的示例代码
10-18
本篇文章主要介绍了EasyUI的DataGrid绑定Json数据源的示例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
easyui的combotree控件绑定json数据的例子
07-07
C#后台生成json串输出，让 easyui-combotree获取json并绑定，然后取得选中节点的值，的简单例子。
easyui下拉框动态级联加载的示例代码
08-28
本篇文章主要介绍了easyui下拉框动态级联加载的示例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
EasyUI实现下拉框多选功能
08-28
主要为大家详细介绍了EasyUI实现下拉框多选功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
【1524】java投票管理系统Myeclipse开发mysql数据库web结构java编程计算机网页项目
qq_251836457的博客
04-18 628
2、开发环境为TOMCAT7.0,Myeclipse8.5开发，数据库为Mysql5.0，使用java语言开发。(5)投票选项管理：对投票选项信息进行添加、删除、修改和查看。(6)投票记录管理：对投票记录信息进行添加、删除、修改和查看。(1)管理员管理：对管理员信息进行添加、删除、修改和查看。(2)用户管理：对用户信息进行添加、删除、修改和查看。(3)公告管理：对公告信息进行添加、删除、修改和查看。(4)投票管理：对投票信息进行添加、删除、修改和查看。4）投票浏览查看、查看投票、投票记录。
2.8 构建gradle环境
蚊者逆袭的博客
04-18 2153
Gradle是一种现代化的构建工具，用于自动化地构建、测试和部署软件项目。它是一种基于JVM（Java虚拟机）的构建工具，最初是为了解决Apache Ant和Apache Maven等传统构建工具的一些限制而开发的。
ReentrantLock
最新发布
Adepth的博客
04-22 605
这是标准库给我们提供的另一种锁，前面我们学到的一种是顾名思义，Reentrant:可重入的 但我们也知道，synchronized锁不也是可重入的嘛?那这个锁到底有什么其他的过人之处呢？
Java中如何实现minio文件上传
Keep__Me的博客
04-19 1152
前面已经在docker中部署了minio服务，那么该如何在Java代码中使用？这篇说下minio在Java中的配置跟使用。
Java-常用API-2
2302_80362563的博客
04-17 884
Object类中提供的equals比较方法有空指针会直接报错，这时就需要用到Objects类中的方法。验证字符串的一种规则，或在文本中查找满足需要的内容，表达式类型为String。拥有非常高的上限，可以用来处理超过long long的整数。预定义字符（Java中，\\表示\）常用于小数的精确计算。
easyui点击下拉框刷新界面
05-31
要实现点击下拉框刷新界面，可以通过以下步骤： 1. 给下拉框绑定 `onSelect` 事件，该事件在用户选择下拉框中的一个选项时触发。 2. 在 `onSelect` 事件中，可以使用 `location.reload()` 方法重新加载当前页面，...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值