关闭

Ajax+SpringMVC 二级联动

标签: ajaxspring mvc
1686人阅读 评论(0) 收藏 举报
分类:

Ajax+SpringMVC 二级联动
效果:选中部门后,负责人下拉框选项中会出现该部门的所有人员
这里写图片描述

  • JSP部分
    注:organizations为后端返回的List
<div class="form-group">
                            <label for="orgId" class="col-sm-3 control-label">所属部门</label>
                            <div class="col-sm-9">
                                <select class="selectpicker" multiple=""  id="orgId" name="orgId" data-width="100%">
                                    <optgroup label="${organizations[0].orgName}">
                                    <c:forEach var="organization" items="${organizations}" begin="1">
                                        ${organization.hierarchy}
                                        <c:if test="${organization.hierarchy == 2}">
                                            </optgroup>
                                            <optgroup label="${organization.orgName}">
                                        </c:if>
                                        <option value="${organization.id}">${organization.orgName}</option>
                                    </c:forEach>
                                    </optgroup>
                                </select>
                            </div>
                        </div>
  • JS部分
$(function() {
    $("#orgId").change(function() {// 改变组织框的值的时候,执行方法getUser();获取对应用户
        getUser();
    });

});
function getUser() {
    var orgId = $("#orgId").find("option:checked").val();
    if (orgId == null || orgId == "") {
        return;
    }
    $.ajax({
        type : 'get',
        url : 'user/getUserByOrg',
        async : false,
        data : {
            orgId : orgId,
        },
        success : function(msg) {
            alert(msg);
            if (msg.length > 0) {
                for (i = 0; i < msg.length; i++) {
                    var responsibleUserId = msg[i].id;
                    var realName = msg[i].realName;

                    var $option = $("<option>").attr({
                        "value" : responsibleUserId
                    }).text(realName);
                    $("#responsibleUserId").append($option);
                }
            } else {
            }
        }
    });
}
  • 后端Java部分

// 显示默认的页面 
    @Override
    @RequestMapping
    public ModelAndView showDefaultPage(HttpSession session) {
        // 获取所有科室。每个节点包含其层次信息
        List<Organization> organizations = organizationBiz.getOrgExceptRoot();
        ModelAndView mav = new ModelAndView();
        mav.addObject("organizations", organizations);
        mav.setViewName(defaultPage);
        return mav;

    }
/**获取组织下的用户*/
    @RequestMapping("getUserByOrg")
    @ResponseBody
    public List<User> getUserByOrg(Integer orgId){
        return biz.getUserByOrg(orgId);
    }

另外可参考:
http://my.oschina.net/u/780884/blog/223595

0
0
查看评论

Ajax+SpringMVC requestBody

ajax+Spring MVC 经验证,上文写的是比较正确的,所以转过来保存一下.传JSON对象前端function test () { var param = {username : "yitop"}; $.ajax({ timeout : 20...
  • power0405hf
  • power0405hf
  • 2017-11-26 16:21
  • 114

jQuery实现二级联动下拉框

jsp页面: 技术方向* ${techDirec} ${techDirec} ...
  • tianguobing
  • tianguobing
  • 2016-12-01 09:34
  • 2149

ajax+springmvc数据交互

ajax传递参数给springmvc一句话总结 通过ajax传递参数给springmvc,经常会因为 参数类型太复杂,或者根本不知道springmvc都支持哪些类型转换,导致后台接收出现各种问题。如果书写格式没有问题仍然接受参数报错,大部分是因为springmvc默认无法支持该种格式的json转...
  • Huangcsdnjava
  • Huangcsdnjava
  • 2017-07-25 15:17
  • 2941

jsp java ajax二级联动实现

数据库sql:  CREATE TABLE `tb_category` (   `cid` char(40) NOT NULL,   `cname` varchar(50) DEFAULT NULL,   `pid` char(40) DEFAULT ...
  • loveyour_1314
  • loveyour_1314
  • 2017-10-12 14:13
  • 338

js实现省市选择二级联动

Untitled Document                      select{      ...
  • zunguitiancheng
  • zunguitiancheng
  • 2015-06-27 11:53
  • 3062

全国城市二级联动js插件

js代码部分:/* * 全国三级城市联动 js版 */ function Dsy(){ this.Items = {}; } Dsy.prototype.add = function(id,iArray){ this.Items[id] = iArray; } Dsy.proto...
  • hj960511
  • hj960511
  • 2016-05-10 09:31
  • 4599

表单验证和二级联动

表单验证和二级联动
  • jinhuoxingkong
  • jinhuoxingkong
  • 2016-05-31 19:53
  • 1460

jquery easyui combobox 二级联动

$(function(){ var provinceId = $('#provinceId').combobox({ url:'${pageContext.request.contextPath}/region/province/jso...
  • cyoubunketu
  • cyoubunketu
  • 2012-05-18 16:49
  • 9900

JQuery实现动态数据二级联动

写此博客原因:项目中需要二级联动,点击一级学科,联动到二级学科,上网查了资料,都写的是从前台获取,很不满意,决定自己写一个二级联动!JQuery:$(function() { //ajax实现二级联动 $.post("${basePath}field/getjson.action"...
  • weixin_38437243
  • weixin_38437243
  • 2017-07-13 16:33
  • 880

js中的二级联动技术的实现

在web开发中我们经常会遇到页面的一个二级联动技术,二级联动字面解释就是说我在选择一级select不同的option,下面的二级option的属性值在进行相应的变动。        下面我先简述一下其中的原理,最后我们再贴代码。     &...
  • xihuansuannai
  • xihuansuannai
  • 2016-05-06 09:47
  • 3546
    个人资料
    • 访问:276895次
    • 积分:2823
    • 等级:
    • 排名:第15033名
    • 原创:70篇
    • 转载:41篇
    • 译文:0篇
    • 评论:24条
    交流方式