表单和表格序列化demo struts2 json(Gson) response.getWriter.write() ajax
2016-09-26 15:02
489 查看
<script> <span> </span>function getOptions(){//用于ajax提交并且参数较多的时候。不用手动去拼ajax的data。 //struts2的模型驱动,会自动将 Object.attr 封装到action中的实体对象中 var container = $("#form1"); var param = {}; var inputs = container.find('input');//数组 var selects = container.find('select'); console.log(inputs) for(var i in inputs) {//遍历数组 if(!isNaN(i)) { var input = inputs[i]; param[input.name] = input.value; } } for(var i in selects) { if(!isNaN(i)) { var select = selects[i]; param[select.name] = $(select).val(); } } alert(JSON.stringify(param)); console.log(param);//Object {myuser.name: "asda", myuser.pwd: "123", myuser.photo: ""} $.ajax({ url:"http://localhost:8080/uploadFil/addUser", data:param, success:function(msg){ alert(msg) }, error:function(msg){ } }) } </script>
<form id="form1" action="" method="post"> 姓名 <input type="text" id="opt1" name="myuser.name"> 年龄 <input type="text" id="opt2" name="myuser.pwd"> 照片 <input type="text" id="opt3" name="myuser.photo"> <button type="button" onclick="getOptions()">获取数据</button> </form>
private User myuser; private String msg; private String userlist; //省略的getter setter
public void addUser(){//通过response写入字符串到前台 OA_UserService userService= new OA_UserService(); msg=String.valueOf(userService.addUser3(myuser)); HttpServletResponse response = ServletActionContext.getResponse(); response.setContentType("text/html;charset=UTF-8"); try { PrintWriter out = response.getWriter(); out.write("sdf"); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } }
<action name="addUser" class="com.yzpc.action.UserAction" method="addUser"></action>
<script> function ergodicTable2(){//根据table得到一个Object[] 或 List<Object> var container=$("#mytable"); var values= []; var obj={}; var objs=[]; var tds=container.find('td'); var trs=container.find('tbody tr') var ths=container.find('th'); var d=tds.length//12 var r=trs.length//4 var h=ths.length//3,因为后台photo是inputStream类型的,所以注释了前台的photo因此这里h=2 for(var i = 0;i<r;i++){//4行,所以list得size为4,目标向后台传一个List<Object> 0,1,2,3 for(var j =0;j<h;j++){//0,1,2 var td=tds[i*h+j].innerHTML console.log(i*h+j) console.log(j) var th=ths[j].innerHTML obj=td } //console.log(JSON.stringify(obj)) objs.push(obj); obj={} } //console.log(JSON.stringify(objs)) $.ajax({ url:"http://localhost:8080/uploadFil/addUserList", type:'POST', data:{ 'userlist':JSON.stringify(objs) }, success:function(msg){ alert(msg) }, error:function(msg){ } }) } </script> <button onclick="ergodicTable2()">复杂table</button> <table id="mytable"> <thead> <tr> <th>name</th><!-- th居中粗体 --> <th>pwd</th> <!-- <th>photo</th> --> </tr> </thead> <tbody> <tr> <td>1</td> <td>2</td> <!-- <td>3</td> --> </tr> <tr> <td>4</td> <td>5</td> <!-- <td>6</td> --> </tr> <tr> <td>7</td> <td>8</td> <!-- <td>10</td> --> </tr> <tr> <td>11</td> <td>12</td> <!-- <td>13</td> --> </tr> </tbody> </table>public void addUserList(){//通过response写入字符串到前台//userlist--->list<User> 前台传入listjsonString Gson gson=new Gson(); List<User> userList = gson.fromJson(userlist, new TypeToken<List<User>>(){}.getType()); for(User u:userList){ OA_UserService userService= new OA_UserService(); msg=String.valueOf(userService.addUser3(u)); } HttpServletResponse response = ServletActionContext.getResponse(); response.setContentType("text/html;charset=UTF-8"); try { PrintWriter out = response.getWriter(); out.write("sdf"); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } }<action name="addUserList" class="com.yzpc.action.UserAction" method="addUserList"></action>
public class User {
private Integer id;
private String name;
private String pwd;
private InputStream photo;相关文章推荐
- jQuery ajax 中级(getScript() ; getJSON() ;ajax; 表单序列化)
- IE8下struts2 采用ajax提交表单,返回json字符串,解析不了,直接保存json字符串。提示下载action.
- response.getWriter().write()向前台打印信息乱码问题解决
- response.getWriter().write()与out.print()的区别(转)
- response.getWriter().write()与out.print()的区别
- 将表单序列化之后变成的json格式的数据无法通过Ajax发送到后台的解决
- Struts2 Jquery Json 实现AJax表单验证
- jquery ajax send json to action and get response from action
- response.getWriter().write()与out.print()的区别
- jquery序列化form表单使用ajax提交后处理返回的json数据
- response.getWriter().write()与out.print()的区别
- response.getWriter().write()产生乱码
- response.getWriter().write()向前台打印信息乱码问题解决
- Jquery $.ajax $.getJson读取本地文件的问题-Received an invalid response not allowed access(echarts本地测试地图包)
- response.getWriter().write("中文");乱码问题
- JSON+AJAX+STRUTS2操作页面表格示例
- jquery序列化form表单使用ajax提交后处理返回的json数据
- response.getWriter().write()与out.print()的区别
- JS 提交表单2-Query Ajax post(json数组,form表单经serialize()序列化,html拼接)
- 2016-AspNet-MVC教学-11-Json-getJSON-Ajax的应用对比Demo