<script type="text/javascript" src="<%=path%>/js/jquery.js">
</script>
<script type="text/javascript" src="<%=path%>/js/jquery.form.js">
</script>
</head>
<body>
<h3>
struts2,jquery ajaxForm插件的使用--验证后提交
</h3>
<form id="myForm" action=""
method="post">
名称:
<input type="text" name="customer.name" id="name" value="" />
<br />
地址:
<input type="text" name="customer.address" id="address" value="" />
<br />
自我介绍:
<textarea name="customer.comment" id="comment" ></textarea>
<br />
<input type="submit" id="test" value="提交" /><br />
<input type="submit" onclick="btn()" value="提交2" />
<br />
<input type="button" onclick="sub()" value="提交Ajax" />
<br />
<div id="output1"></div>
</form>
<script type="text/javascript">
function sub() {
var name = $("#name").attr("value");
//var name=document.getElementById("name").value;
alert(name);
$.ajax( {
url : "<%=path%>/test/test!submitt.action?customer.name=" + name,
cache : false,
success : function(json) {
alert(json.name);
}
});
}
<%--
demo1
$(document).ready(function() {
$('#myForm').ajaxForm( {
// 声明 服务器返回数据的类型.
dataType : 'json',
success : processJson
});
});--%>
<%---
demo2
$(document).ready(function() {
$('#myForm').ajaxForm(options);
});
var options={
url:"<%=path%>/test/test!submitt.action",
dataType : 'json',
success : processJson
};
--%>
function btn1(){
$('#myForm').submit(function(){
$(this).ajaxSubmit(options);
return false;
});
}
function btn2(){
$('#myForm').ajaxForm(options);
}
function btn(){
$('#myForm').ajaxForm({
url:"<%=path%>/test/test!submitt.action",
dataType : 'json',
success : processJson
});
}
var options={
url:"<%=path%>/test/test!submitt.action",
dataType : 'json',
success : processJson
};
function processJson(json) {
// 'data'是一个json对象,从服务器返回的.
alert(json.name+"成功了");
}
alert("sdf");
</script>
</body>
</html>
下面是PO
package po;
public class Customer {
private String name;
private String address;
private String comment;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getAddress() {
return address;
}
public void setAddress(String address) {
this.address = address;
}
public String getComment() {
return comment;
}
public void setComment(String comment) {
this.comment = comment;
}
}
下面是Action
package test;
import po.Customer;
import com.opensymphony.xwork2.ActionSupport;
public class CustomerAction extends ActionSupport {
private static final long serialVersionUID = 1L;
private Customer customer = new Customer();
public String init() {
return "init";
}
public String submitt() {
System.out.println(customer.getName());
System.out.println(customer.getAddress());
System.out.println(customer.getComment());
return "checkPerson";
}
public Customer getCustomer() {
return customer;
}
public void setCustomer(Customer customer) {
this.customer = customer;
}
public static long getSerialversionuid() {
return serialVersionUID;
}
}
最后是struts.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
<package name="test" namespace="/test" extends="struts-default,json-default">
<action name="test" class="test.CustomerAction" method="init">
<result name="init">/index.jsp</result>
<result name="add">/ok.jsp</result>
<result name="checkPerson" type="json">
<param name="root">customer</param>
</result>
</action>
</package>
</struts>
分享到:
相关推荐
Demo 5 : form插件的使用--验证后提交(简单验证). Demo 6 : form插件的使用--验证后提交. Demo 7 : form插件的使用--验证后提交. Demo 8 : form插件的使用--dataType的其他方式. 另外还有JSP版的部分小实例,和...
使用jQuery.form插件,实现完美的表单异步提交
ajaxForm插件
Struts2 jQuery Ajax 单页面增删改查,附带Mysql数据脚本!
MVC Struts2框架搭建,Jquery Ajax异步数据交互,内涵需要的jar包及ppt讲解
Aspnet-ASP.NET-Core-2-jQuery-Ajax-Modal-Form.zip,使用asp.net core 2 mvc jquery ajax bootstrap model formasp.net-core-2-jquery-ajax-model-form实现模式表单,asp.net是一个开源的web框架,用于使用.net构建...
Ajax表单提交插件jquery form
JavaScript/CSS/DOM基础 第0课 - 内容概述 - [精通JavaScript+jQuery] 第1课 - JavaScript背景知识-[精通JavaScript+jQuery] 第2课 - JavaScript基础 - [精通...第15课 - jQuery插件 - [精通JavaScript+jQuery]
struts2 + jquery +ajax 登录验证
Struts2+jQuery ajax的一个商品小系统Struts2+jQuery ajax的一个商品小系统
Struts Hibernate Spring AjaxStruts Hibernate Spring Ajax
这圣思园张老师的一个上课演示文件,讲的是struts2+jquery+Ajax实现异步交互的简单例子。
Jquery validate和form两个插件,完美进行表单验证和Ajax无刷新方式提交form表单,很有用的哦。
struts2防止表单重复提交--重定向
ajax刷新表格数据 ajaxform异步提交表单数据, jquery.validate验证表单数据
jquery form ajax 插件
Ajax-JQuery-JSON-Form-Binding.zip,用于将json数据绑定到表单的轻量级插件。对于使用ajax和具有大量字段的表单很有用。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和...
ajax-axios-url-form-serialize 插件
jquery ajax分页插件 jquery ajax分页插件 jquery ajax分页插件
Ajax-JQuery-Ajax-POST-in-Codeigniter.zip,如何将带有数据的ajax post请求发送到codeigniter控制器,而不刷新页面并将数据返回到视图。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json...