通过在jquery中添加函数发送ajax请求来加载数据库数据,以json的格式发送到页面

从数据库中查询仓库信息,显示在下拉菜单中:

首先,引入js插件,这里使用jquery-1.8.3.js

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.js"></script>

当页面加载完成后,就应该发送ajax请求到数据库,来加载数据到下来菜单中

故这是一个页面加载事件

$(function(){

//dom初始化后加载

//$.post(请求url,请求参数,回调函数,返回的类型);

$.post("${pageContext.request.contextPath}/store_listAjax.action",function(data){

//data:转换后的对象:json对象数组-dom对象

alert(data);

});

});

</script>

这时候响应到页面的应该是json格式的数据

所以在store_listAjax.action中的返回的结果集类型必须为json格式

其对应在struts.xml中的结果集类型

当上面都完成后,这时候就需要把返回到页面的json格式的数据data放到下拉菜单中

根据jquery API 可以找到 $(object).each([callback])的方法,这是又一个通用方法,可用于遍历对象和数组,object是需要遍历的对象或者数组,callback是每一个成员/元素需要执行的回调函数

将alert(data)替换成以下代码

$(data).each(function(){

var option=$("<optionvalue='"+this.id+"'>"+this.name+"</option>");

//添加到下拉列表中

$("#store_id").append(option);

});

这时候就可以把数据库中的数据添加到下拉菜单中

转载于:https://www.cnblogs.com/whstudy/p/7288032.html

通过在jquery中添加函数发送ajax请求来加载数据库数据,以json的格式发送到页面...相关推荐

  1. ros中web端通过 ajax 访问 nginx 加载静态 pgm 地图显示在canvas画布中

    ros中web端通过 ajax 访问 nginx 加载静态 pgm 地图显示在canvas画布中 //mapName:地图名称 | robotfloor:楼层if(mapName.length ==0 ...

  2. Jquery导航条淡进淡出相册(动态无刷新加载数据库数据)

    原理:AJAX动态加载数据库中图片信息给游览器,利用2个叠词div动态修改内部图片透明度做出淡进淡出效果.(IE6无效) 难点:json数组操作. HTML:就是几个图片容器.加载大图的div pos ...

  3. vue中如何实现点击按钮后加载更多数据

    一.点击按钮后加载更多的数据显示 在 data 中,定义 pageIndex,默认为 1 ,默认展示第一页数据.定义 comments,默认为空数组,里面保存所有的评论数据,代码如下所示: data( ...

  4. ECharts3 实现 AJAX异步加载 数据库数据

    ECharts3的文档里其实对异步加载说的很明白,但是示例都是生成的随机数据,大多数应用是直接读数据库数据然后动态加载到ECharts图表里的,简单的思路就是把需要显示的数据库数据封装成json格式, ...

  5. React基础-React中发送Ajax请求以及Mock数据

    前言 在 React 中, render 函数返回的结果,取决于组件的 props 和 state 我们都知道 UI 页面上的数据不是写死的,往往是从后端的数据接口中拿到的 然后将真实的数据填充到页面 ...

  6. React学习(九)-React中发送Ajax请求以及Mock数据

    虽互不曾谋面,但希望能和你成为笔尖下的朋友 以读书,技术,生活为主,偶尔撒点鸡汤 不作,不敷衍,意在真诚吐露,用心分享 点击左上方,可关注本刊 撰文 | 川川 VX-ID:suibichuanji 点 ...

  7. ajax返回的图片数据格式,jquery发送ajax请求返回数据格式

    jquery向服务器发送一个ajax请求后,可以返回多种类型的数据格式,包括:html,xml,json,text等. 1.html格式的数据 " "+username+" ...

  8. Jquery中发送ajax请求示例代码

    场景 jquey中实现发送ajax请求. 实现 function printCode(id){debugger$.ajax({type: 'POST',url: "",cache: ...

  9. jQuery 发送 AJAX 请求

    AJAX 请求状态 xhr.readyState 可以用来查看请求当前的状态 参考官方文档的链接:https://developer.mozilla.org/zh-CN/docs/Web/API/XM ...

  10. jQuery中的$.getJSON、$.ajax、$.get、$.post的区别

    jQuery中的$.getJSON.$.ajax.$.get.$.post的区别 使用见Flask(python)异步(ajax)返回json格式数据 ①.$.getJSON $.getJSON()是 ...

最新文章

  1. 【Manning新书】可解释人工智能: 构建可解释机器学习系统
  2. 工作总结 npoi 模板 导出公式 excel
  3. RabbitMQ-从基础到实战(3)— 消息的交换(上)
  4. ad20如何画出pcb板大小_多层pcb板是如何抄板的?
  5. 8.11模拟:数据结构
  6. Ubuntu 安装 Vue.js
  7. php表白页面,2020情人节表白页面(代码分享)
  8. 《深入理解 Spring Cloud 与微服务构建》第十六章 Spring Boot Security 详解
  9. java的数组(二维)
  10. python3制作歌词解析器
  11. JavaScript 编程精解 中文第三版 五、高阶函数
  12. 迎接天翻地覆的重大演变:微软加速器区块链论坛成功举办
  13. 来西安必看的旅游攻略!看过来,带你玩转西安!
  14. [ERP/鼎捷E10]VMI业务在E10中的处理
  15. 微信小程序:高德地图在小程序中的实践(含静态地图)
  16. sqlsugar模糊查询
  17. P-Link ARM Cortex-M脱机编程器开源前的一些准备工作----第四章 几个重要的结构体介绍
  18. NanoPi NEO小试牛刀(二)
  19. 能在html中打开ppt吗,怎样在PPT中直接打开网页
  20. 2020年书法落款_书法落款能不能写“年”字?

热门文章

  1. 一年级abb式词语并造句_ABB式词语如何活学活用,家长都收藏了!
  2. 分布式文件系统_新一代分布式文件系统XGFS揭秘——元数据服务
  3. java什么是适配器类?作用是什么?_浅谈Java适配器模式
  4. spark mlib行矩阵(RowMatrix)入门
  5. 【JavaScript回顾】闭包
  6. 搭建Discuz论坛的两种方式
  7. 关于Oracle-SQL语句性能优化
  8. 扩展GridView控件(2) - 复合排序和排序状态提示
  9. 理解与学习linux 文件系统的目录结构
  10. 没事不要在for循环期间增减迭代序列的成员