Struts2+JQuery+Json及JQuery有关插件的例子

Struts2+JQuery+Json及JQuery相关插件的例子

文章来源: http://www.360doc.com/content/10/0731/19/117897_42788515.shtml#

注意事项：

? 1.开发时，应将工程及相应的页面数据库编码均设为：utf8解决乱码问题；

??2.当前开发版本为struts2.1.8，不同的struts2版本会有不同的jar包需要引入，具体见readme.txt

? 3.autocomplete插件不是很完善，尚不能处理json数据；弹出层框架只针对图片(可修改格式适应其它形式)

readme.txt:

?????????????

1.JQuery的Ajax实现并与struts2的结合2.配置过程：a.新建web项目;b.修改web.xml文件c.在src下添加struts.xml文件,添加jar包支持:freemarker.jar ognl.jar struts2-core.jar commons-fileupload.jarcommons-io.jar xwork-core-2.1.6.jar（这个包加上版本号，是因为下文要提到它），注意jar包支持这六个包是struts必须依赖的jar包d.配置jsp文件,在jsp里面添加jquery支持e.配置actionf ( 一)在struts2.1.6之前的版本：添加相应的json包:json-lib.jar jsonplugin.jar 这里要注意很重要的一点，因为json大量引用了Apache commons的包，所以这里要一并加入，需要的commons包共4个，除了commons的包外，还需要引入一个 ezmorph的包，所以这一步一共要引入7个包，列出如下：commons-collections.jar commons-lang.jarcommons-beanutils.jar commons-logging.jar ezmorph.jar 再加上json的两个包共七个(二)struts2.1.6，添加jsonplugin0.34或者jsonplugin0.7（三)struts2.1.8则添加json-lib-2.2.3.jar,struts2-json-plugin,struts2-junit-plugin3.插件使用：1.validation插件：详见table-validation.jsp，主要为引入一个jquery.validate.js，获取相应的属性名来进行验证;2.tablesort插件：目前用的是兼容中文的官网版本,一是可以实现自动排序，二是支持中文;要注意在table当中的格式，这点很重要3.tablesortpager插件JQuery与Json结合的一些注意事项：1.$.get(url,data,function(data){eval(data);})eval(data)将数据转换为js对象；实际上如果返回的json对象，可通过将参数直接命名为json即可，如下$.get(url.data,function(data){},"json")2.取json属性时，尽量用中括号方式，原因是如果有数字属性会发生不识别的现象eg:var a=obj["31001"];//obj.31001则可能出错解决办法有其它方式：比如将属性值31001改为s310013.乱码问题:在struts1.2中，通过设置表头的编码来解决乱码问题，注意对于xml和json，要分别设置为text/xml和text/jsoneg:response.setContentType("text/json; charset=utf-8");

1.struts.xml配置：

?????????????

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE struts PUBLIC"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN""http://struts.apache.org/dtds/struts-2.0.dtd"><struts><constant name="struts.i18n.encoding" value="utf-8"></constant><package name="S2SHJQuery" extends="json-default"><action name="show" name="code">package action;import java.util.ArrayList;import java.util.List;import java.util.Map;import org.apache.struts2.json.annotations.JSON;import com.opensymphony.xwork2.ActionSupport;public class ShowAction extends ActionSupport {private String testvalue;private String result;private List<String> list;private List<User> userlist;private User user;private Map<String, User> map;private String[] autoarray;public String[] getAutoarray() {return autoarray;}public void setAutoarray(String[] autoarray) {this.autoarray = autoarray;}@JSON(serialize=false)public Map<String, User> getMap() {return map;}public void setMap(Map<String, User> map) {this.map = map;}@JSON(serialize=false)public User getUser() {return user;}public void setUser(User user) {this.user = user;}@JSON(serialize=false)public List<User> getUserlist() {return userlist;}public void setUserlist(List<User> userlist) {this.userlist = userlist;}@JSON(serialize=false)public List<String> getList() {return list;}public void setList(List<String> list) {this.list = list;}public void setTestvalue(String testvalue) {this.testvalue = testvalue;}@JSON(serialize=false)public String getTestvalue() {return testvalue;}@JSON(serialize=false)public String getResult() {return result;}public void setResult(String result) {this.result = result;}@Overridepublic String execute() throws Exception {// TODO Auto-generated method stubSystem.out.println("test is ok: "+testvalue);//1.????string/*int i=9;//result=""+i+"";result="中国";*///2.list?/*list=new ArrayList<String>();list.add("allen");list.add("中国");list.add("adc");*///3.list?а?User/*userlist=new ArrayList<User>();User user1=new User();user1.setPassword(1);user1.setUsername("username1");User user2=new User();user2.setPassword(2);user2.setUsername("username2");User user3=new User();user3.setPassword(3);user3.setUsername("username3");userlist.add(user1);userlist.add(user2);userlist.add(user3);*///4.User???????/*user=new User();user.setPassword(1);String username="中国";user.setUsername(username);System.out.println(user.getUsername());*///5.map????/*map=new HashMap<String, User>();User user1=new User();user1.setPassword(1);user1.setUsername("username1");User user2=new User();user2.setPassword(2);user2.setUsername("username2");User user3=new User();user3.setPassword(3);user3.setUsername("username3");map.put("s1",user1 );map.put("s2",user2 );map.put("s3",user3 );*//*map=new HashMap<String, String>();//??????String,string???map.put("s1","user1");map.put("s2","user2");map.put("s3","user3");*///7.直接传递数祖autoarray=new String[3];autoarray[0]="a";autoarray[1]="b";autoarray[2]="c";return SUCCESS;}}

3.show.jsp配置:

????????????????????

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><mce:script type="text/javascript" src="/S2SHJQuery/js/jquery.js" mce_src="S2SHJQuery/js/jquery.js"></mce:script><base href="<%=basePath%>"><title>struts2+jquery+json</title><mce:script type="text/javascript"></mce:script></head><body><form><input type="button" value="JQuery" id="jquerytest"><br><input type="text" value="美国" name="test" id="test"></form></body></html>??

4.tableopen.jsp弹出层插件:

??????????????

view plaincopy to clipboardprint?

<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Strict//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">?? <html?xmlns="http://www.w3.org/1999/xhtml"?xml:lang="en">??
?? <head>??
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/>?? <title>Thickbox?Plus?-?Download?by?http://www.codefans.net</title>??
?? <mce:style?type="text/css"?media="all"><!-- ?
@import?"css/global.css"; ? --></mce:style><style?type="text/css"?media="all"?mce_bogus="1">@import?"css/global.css";</style>??
<mce:script?src="/S2SHJQuery/js/jquery.js"?mce_src="S2SHJQuery/js/jquery.js"?type="text/javascript"></mce:script>?? <mce:script?src="/S2SHJQuery/lib/thickbox_plus.js"?mce_src="S2SHJQuery/lib/thickbox_plus.js"?type="text/javascript"></mce:script>??
?? </head>??
<body>?? ????<div?id="contentPad">??
????<h1>Thickbox?Plus</h1>?? ????<div>??
????????<a?href="images/image1.jpg"?mce_href="images/image1.jpg"?title="Sample?caption"?class="thickbox"><img?src="images/image1_t.jpg"?mce_src="images/image1_t.jpg"?alt="Image?1"?/></a>?? ?????????? ??
????????<a?href="images/image2.jpg"?mce_href="images/image2.jpg"?title="Another?sample?caption"?class="thickbox"><img?src="images/image2_t.jpg"?mce_src="images/image2_t.jpg"?alt="Image?2"/></<

Struts2+JQuery+Json及JQuery有关插件

热点推荐