这两天在做查询,如何利用Ajax将form表单整个提交困扰了我很久,上网找了,很多都说要把form中的每个变量作为参数传进去。但是这个方法,不能解决我的问题。如果form中的变量很多呢,那你的参数岂不是很长,而且参数长度一定是没有限制的吗??这是一个很严重的问题。经过一天的查找,终于找到一篇好帖子:
Ajax中用get进行提交的例子很多,今天在这里写一个用post提交的例子,顺便也把get的加上吧,以供自己和别人以后使用的时候参考,这里用到了prototype.js框架的Ajax,prototype.js在这里就不介绍了。代码如下:
<html>
<head>
<title>prototype test</title>
<script type="text/javascript" src="js/prototype-1.5.1.2.js"></script>
<script type="text/javascript">
function prototype_ajax_get(){
var url = "PrototypeAjax.do";
var pars = "uname=London&reqid=" + Math.random();
var myAjax = new Ajax.Request(
url,
{method: 'get', parameters: pars, onComplete: prototype_response}
);
}
function prototype_ajax_post(){
var url = "PrototypeAjax.do";
var myAjax = new Ajax.Request(
url,
{method: 'post', parameters: Form.serialize(document.forms[0]), onComplete: prototype_response}
);
}
function prototype_response(req){
alert(req.responseText);
}
</script>
</head>
<body>
<form>
uname:<input type="text" name="uname" value=""><br>
<input type="button" value="Prototype" οnclick="prototype_ajax_get()" />
<input type="button" value="Prototype" οnclick="prototype_ajax_post()" />
</form>
</body>
</html>
但是这里一定不要忘记在你的jsp页面加上这个:
<script type="text/javascript" src="<%=basePath%>contract/js/common/prototype.js;jsessionid=<%=request.getSession().getId()%>"></script>
这个是用来调用prototype.js,否则上面的js是不起作用的。