登录  /  注册
首页 > web前端 > js教程 > 正文

用户管理--用jquery的ajax实现二级联动

巴扎黑
发布: 2017-07-20 13:27:30
原创
1118人浏览过

页面效果


实现步骤

1.引入struts整合json的插件包

2.页面使用jquery的ajax调用二级联动的js

//ajax的二级联动,使用选择的所属单位,查询该所属单位下对应的单位名称列表function findJctUnit(o){//货物所属单位的文本内容var jct = $(o).find("option:selected").text();$.post("elecUserAction_findJctUnit.do",{"jctID":jct},function(data,textStatus){               //先删除单位名称的下拉菜单,但是请选择要留下   $("#jctUnitID option").remove();if(data!=null &amp;&amp; data.length&gt;0){for(var i=0;i<data.length>");
                          $option.attr("value",ddlCode);
                          $option.text(ddlName);
                          $("#jctUnitID").append($option);
                   }
            }
        });
        
    }</data.length>
登录后复制

3.在Action类中定义findJctUnit()方法,这里要将返回的List集合放置到栈顶,struts2将其转换成json数据

/**  
    * @Name: findJctUnit
    * @Description: 使用jquery的ajax完成二级联动,使用所属单位,关联单位名称
    * @Parameters: 无
    * @Return: 使用struts2的json插件包*/public String findJctUnit(){//1:获取所属单位下的数据项的值(从页面提交的jctID值,不是数据字典中的ddlcode)String jctID = elecUser.getJctID();//2:使用该值作为数据类型,查询对应数据字典的值,返回List<elecsystemddl>List<elecsystemddl> list = elecSystemDDLService.findSystemDDLListByKeyword(jctID);//3:将List<elecsystemddl>转换成json的数组,将List集合放置到栈顶        ValueUtils.pushValueStack(list);return "findJctUnit";
    }</elecsystemddl></elecsystemddl></elecsystemddl>
登录后复制
<span style="font-size: 14px">  其中,findSystemDDLListByKeyword(jctID)是在数据字典service中实现的方法,主要根据数据类型名称查询数据字典,返回list集合对象<br><br>  ValueUtils是一个工具类,pushValueStack方法将list压入到struts2值栈的栈顶</span>
登录后复制
public class ValueUtils {public static void pushValueStack(Object object) {
        ServletActionContext.getContext().getValueStack().push(object);
    }
}
登录后复制

  struts2的插件包会将压入到struts2值栈的list集合中对象所有的属性全部被json化

4.在struts.xml中定义

(1)修改 extends值

修改前

<!-- 系统管理 --><package></package>
登录后复制
登录后复制

修改后

<!-- 系统管理 --><package></package>
登录后复制
登录后复制

(2)添加映射

<!-- 如果是List集合,转换成json数组;如果是object对象,转换成json对象 --><result></result>
登录后复制

完成上述步骤以后,即可实现选中所属单位下拉框的值,在单位名称下拉选项中有对应值。

在浏览器页面查看json数据如下:

若想针对某个属性被json化,此时可以修改struts.xml文件

<!-- 如果是List集合,转换成json数组;如果是object对象,转换成json对象 --><result><param>\[\d+\]\.ddlCode,\[\d+\]\.ddlName</result>
登录后复制

这里使用正则表达式拦截一个或多个ddlCode和ddlName,这样json数据中就只含有ddlCode和ddlName了。

以上就是用户管理--用jquery的ajax实现二级联动的详细内容,更多请关注php中文网其它相关文章!

智能AI问答
PHP中文网智能助手能迅速回答你的编程问题,提供实时的代码和解决方案,帮助你解决各种难题。不仅如此,它还能提供编程资源和学习指导,帮助你快速提升编程技能。无论你是初学者还是专业人士,AI智能助手都能成为你的可靠助手,助力你在编程领域取得更大的成就。
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
关于CSS思维导图的课件在哪? 课件
凡人来自于2024-04-16 10:10:18
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号