首页 > 代码库 > 使用grails级联更新下拉列表
使用grails级联更新下拉列表
实现级联更新效果有多种方式,现只介绍用jquery框架的ajax技术实现的方式,个人认为使用jquery的方式更好更灵活,因为它只负责传数据,如果用grails自带的异步更新,简单的还可以,如果是复杂一点的就比较难搞。
下列代码无需考虑业务意义
jquery的ajax实现:
1.GSP中_form.gsp的简略代码:
<div> <g:select id="company" name="company.id" from="${companyInstanceList}"/> </div> <div> <g:select id="salaryType" name="salaryType" from="${unassignedType}"/> </div> <div> <g:select id="operator" name="operator.id" from="${managements}"/> </div> 2.javascript代码 <script> $("#company").bind("change", function(){ $("#salaryType option").remove(); var company = $("#company").val() $.ajax({ url: "findUnassignedType", type: "POST", data: {‘companyId‘: company} , success: function(result){ //此处result返回的是一个map,key是salaryType,value是salaryType下的operator选项 $.each(result, function(key, value){ $("#salaryType").append("<option value="http://www.mamicode.com/ + key + ">" + key + "</option>") $("#operator option").remove() for(var i=0; i < value.length; i++){ $("#operator").append("<option value="http://www.mamicode.com/ + value[i].id + ">" + value[i].name + "</option>") } }); } }); }); $("#company").change(); $("#salaryType").bind("change", function(){ $("#operator option").remove(); var salaryType = $("#salaryType").val() $.ajax({ url: "findManagements", type: "POST", data: {‘salaryType‘: salaryType} , success: function(result){ for(var i=0; i < result.length; i++){ $("#operator").append("<option value="http://www.mamicode.com/ + result[i].id + ">" + result[i].name + "</option>") } } }); }); $("#salaryType").change(); }) </script> 3.controller代码 /** * ajax查询未分派完的公司的项目种类 * @Author luoshida */ def findUnassignedType() { def cAssigns = CAssign.findAllByCompany(Company.get(params.companyId.toLong())) def unassignedType = CAssign.constraints.salaryType.inList cAssigns.each{elem -> unassignedType = unassignedType - elem.salaryType } Map map = new HashMap() unassignedType.each{ elem -> List operators = new ArrayList() Management.findAllBySalaryTypeAndAssignType(unassignedType.get(0), "企业专管员").each{ elem02 -> operators.add(elem02.operator) } map.put(elem, operators) } render map as JSON } /** * ajax查找项目种类对应的专管员 * @Author luoshida */ def findManagements() { def managements = Management.findAllBySalaryTypeAndAssignType(params.salaryType, "企业专管员") List operators = new ArrayList() managements.each{ elem -> operators.add(elem.operator) } render operators as JSON } 注意,返回的时候必须要以JSON字符串的类型返回,此处要导入一个包grails.converters.JSON
本文出自 “技术随笔” 博客,请务必保留此出处http://6367966.blog.51cto.com/6357966/1541627
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。