ajax异步读取后台传递回的下拉选项的值方法
时间:2018-08-21
今天小编就为大家分享一篇ajax异步读取后台传递回的下拉选项的值方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
jsp中html相关代码
<tr> <td class="tdcell_word2">请选择展会:</td> <td class="tdcell_word3" colspan="3"> <select name="select" id="jieci" onchange="getChange()"> <option value="">选择展会</option> </select> <script Language="JavaScript"> loadjieci('- 选择展会 -'); </script> <span style="color:red;"> *</span> <span style="font-size:12px;color:red;" id="mesjieci"></span> </td> </tr>
js中相关代码
<script Language="JavaScript"> function loadjieci(str) { /** 异步加载届次 */ $.getJSON("/DictsAction.do?actionType=jieci", function (responseData, status) { if (status != "") { $("#jieci").empty(); $("<option/>").html("- 选择展会 -").val("- 选择展会 -").appendTo("#jieci"); $(responseData).each(function (n) { $("<option/>").html(this.name).val(this.code).appendTo("#jieci"); }); //默认显示请选择 $("#jieci").val(str); } else { alert("届次加载失败!"); } }); } </script>
struts-config.xml中相关配置
<!-- ajax异步加载字典 --> <action path="/DictsAction" type="oa.sys016.oagzxxgl.action.DictsAction" scope="request" />
java后台代码
package oa.sys016.oagzxxgl.action; import java.io.PrintWriter; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import net.sf.json.JSONArray; import org.apache.struts.action.Action; import org.apache.struts.action.ActionForm; import org.apache.struts.action.ActionForward; import org.apache.struts.action.ActionMapping; import cn.com.chx.bo.AppBo; /** * 通过ajax加载届次选择下拉列表的选择项 * @author liu * */ public class DictsAction extends Action{ private AppBo appBo = null; @Override public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception { // 设置编码 response.setContentType("application/json;charset=UTF-8"); response.setCharacterEncoding("UTF-8"); PrintWriter out = response.getWriter(); appBo = new AppBo(); try { // 获取ActionType String actionType = request.getParameter("actionType"); if (actionType != null && actionType.equals("jieci")) { // 查询届次 String jieciJson = getJieciJson(); out.print(jieciJson); } } catch (Exception e) { e.printStackTrace(); } finally { out.close(); } return null; } private String getJieciJson() { // 查询届次 List jieciList; try { jieciList = appBo.query("SELECT ID AS CODE,ZH_NAME AS NAME FROM ZH_GZ_INFOX"); List<Map<String, String>> lists = new ArrayList<Map<String, String>>(); if (jieciList.size() > 0) { for (int i = 0; i < jieciList.size(); i++) { Map<String, String> maps = new HashMap<String, String>(); maps.put("code", (String) ((HashMap) jieciList.get(i)).get("CODE")); maps.put("name", (String) ((HashMap) jieciList.get(i)).get("NAME")); lists.add(maps); } } // [{"id":"1","name":"CIMT2015"},{"id":"2","name":"CCMT2016"}] JSONArray json = JSONArray.fromObject(lists); return json.toString(); } catch (Exception e) { e.printStackTrace(); } return null; } }
以上这篇ajax异步读取后台传递回的下拉选项的值方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
- 揭秘新人机大战柯洁对手天壤 AI排名已力压Deepzen
- 一路走到java工程师,java都快出java9了,到底该如何学java?
- 网站发布合并bll问题的解决
- 痛并快乐着:浅谈大数据时代的分布式存储架构
- linux运维中的命令梳理(四)
- linux运维中的命令梳理(三)
- 轻松水印-批量提取exif信息加水印的工具
- Enterprise Library 4.1学习笔记7----缓存应用程序块之SqlDependency
- linux运维中的命令梳理(一)
- 可视化你的BLAST结果
- linux运维中的命令梳理(二)
- VB-取日期属于星期几
- 全球AI新闻创新实践系列③:华邮、雅虎、美联社、Quartz怎么干!
- nginx+php负载均衡集群环境中的session共享方案梳理
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Linux用户管理
- 有赞 GO 项目单测、集成、增量覆盖率统计与分析
- RSA--通过模和指数加密模板--无填充
- 有赞发号器多机房方案
- python爬虫以及后端开发--实用加密模板整理
- APP脱壳方法三
- Flink Checkpoint 原理流程以及常见失败原因分析
- Docker原理之 - OverlayFS设计与实现
- 有赞零售跨平台打印库方案
- [Go] Golang练习项目-GO语言实现快速排序-第一个数作为基准更容易理解
- 有赞移动基础设施建设的实践和思考
- 大数据理论篇HDFS的基石——Google File System
- 6. 二十不惑,ObjectMapper使用也不再迷惑
- 接口自动化对比工具实践
- 什么?Java9这些史诗级更新你都不知道?Java9特性一文打尽!