程序猿全敏
2016-10-09 10:34:47
原
手把手教你们通过jquery ajax调用查询java servlet后端数据+js拼接字符串
1.首先,新建一个web项目,创建一个User实体,
package com.qm; public class User { private String name; private String sex; private int age; public User() { } public User(String name, String sex, int age) { super(); this.name = name; this.sex = sex; this.age = age; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getSex() { return sex; } public void setSex(String sex) { this.sex = sex; } public int getAge() { return age; } public void setAge(int age) { this.age = age; } }
2.新建一个servlet 由于是查询所有我把它命名为FindAll ,实现doGet doPost方法
3.首先我创建几个用户,然后把它们放进ArrayList;然后通过Json转换工具类把它转换成Object,再把它放进Map
Object userobj=JsonUtil.toJson(userList); HashMap<String,Object> json=new HashMap<String,Object>(); json.put("userobj", userobj);
4.现在再看页面。因为jquery1.6自带有ajax,我就导入js文件,然后页面得到
$.ajax({ url : "<%=request.getContextPath()%>" + "/FindAll", type : "post", dataType : "json", success : function(data) { var d= eval('('+data.userobj+')'); for ( var i = 0; i < d.length; i++) { if($("#tbody tr").length<d.length){ $("#tbody").append("<tr><td>"+d[i]["name"]+"<td>"+d[i]["sex"]+"</td><td>"+d[i]["age"]+"</td></tr>"); } } } });
这里我用了字符串拼接的形式把它得到的;
5.得到结果
猜你喜欢
- 手把手教你们通过jquery ajax调用查询java struts2后端数据+js拼接字符串
- JQuery和Servlet实现文件上传进度条,能显示上传速度,上传的百分比等
- jquery图片裁剪插件jquery.jcrop.js上传图片文件到java servlet服务端的实例
- java servlet调用百度AI开放平台动物识别API和百度百科API实现动物识别的实例
- JavaScript和Servlet实现树形菜单
- jquery定时器插件jQuery Timers
- jquery分页插件
- jquery生成图片验证码
- jQuery开发素色中国地图
- jquery生成二维码
- JQuery UI dialog Demo
- jquery的Cookie插件cookies
请下载代码后再发表评论
文件名:test.rar,文件大小:111.054K
下载
- /
- /test
- /test/.classpath
- /test/.project
- /test/.settings
- /test/.settings/.jsdtscope
- /test/.settings/org.eclipse.jdt.core.prefs
- /test/.settings/org.eclipse.wst.common.component
- /test/.settings/org.eclipse.wst.common.project.facet.core.xml
- /test/.settings/org.eclipse.wst.jsdt.ui.superType.container
- /test/.settings/org.eclipse.wst.jsdt.ui.superType.name
- /test/src
- /test/src/com
- /test/src/com/qm
- /test/src/com
- /test
相关代码
最近下载
charleswang LV7
2022年6月16日
dengjunjun LV15
2022年3月29日
IT达人 LV22
2021年7月7日
小白jmhuang LV12
2021年5月28日
锐vi123 LV11
2021年1月5日
zdl638 LV6
2020年4月25日
小肥羊 LV16
2019年11月3日
fff方法ff反反 LV6
2019年10月30日
陆信乾 LV6
2019年8月30日
tonghao LV18
2019年7月30日
最近浏览
颜菜菜 LV2
2023年12月19日
xiongwei11231 LV8
2023年12月2日
ling7314 LV4
2023年5月29日
renyuan LV9
2022年12月11日
青灯呀 LV10
2022年6月23日
charleswang LV7
2022年6月16日
赵欣婷 LV4
2022年5月26日
阿布屋脊 LV7
2022年5月7日
chenzhen23 LV7
2022年4月20日
dengjunjun LV15
2022年3月29日