ajax提交form表单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>send string</title>
<script language=javascript>
var xmlhttp;
function createxmlhttprequest(){
if(window.ActiveXObject) {
xmlhttp=new ActiveXObject((navigator.userAgent.toLowerCase().indexOf('msie 5') != -1) ?
'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP');
}
}
function sendstring(){
for(var i=0;i<2;i++){
createxmlhttprequest();
xmlhttp.onreadystatechange=statechange;
xmlhttp.open('POST','ajax.aspx',false);
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send(getFormQueryString("ff"));
}
}
function statechange(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("x").innerHTML=xmlhttp.responseText;
}
}
function Button1_onclick() {
sendstring();
}
//得到一个表单里的全部信息
function getFormQueryString(frmID){
var frmID=document.getElementById(frmID);
var i,queryString = "", and = "";
var item; // for each form's object
var itemValue;// store each form object's value
for( i=0;i<frmID.length;i++ ) {
item = frmID[i];// get form's each object
if ( item.name!='' ) {
if ( item.type == 'select-one' ) {
itemValue = item.options[item.selectedIndex].value;
}else if ( item.type=='checkbox' || item.type=='radio') {
if ( item.checked == false ){
continue;
}
itemValue = item.value;
}else if ( item.type == 'button' || item.type == 'submit' || item.type == 'reset' || item.type == 'image'){ // ignore this type
continue;
}else {
itemValue = item.value;
}
itemValue = encodeURIComponent(itemValue);
queryString += and + item.name + '=' + itemValue;
and="&";
}
}
return queryString;
}
</script>
</head>
<body >
<form id=ff name=ff>
<input type=text id="tbx" name="tbx" />
<input id="Button1" type="button" value="button" language="javascript"
onclick="return Button1_onclick()" /><br />
<br />
<br />
<div id=x></div>
asdf<input id="Checkbox1" name="weew" type="checkbox" />
<input id="Radio1" name="sdfsdf" type="radio" />
<input id="Radio2" checked="checked" name="fff" type="radio" />
<textarea id="TextArea1" cols="20" name="wr2234" rows="2"></textarea>
<select id="Select1" name="fff">
<option selected="selected" value="1">dsf</option>
<option value="2">214312</option>
<option value="3">23421</option>
</select>
</form>
</body>
</html>
Ajax如何无刷新提交form里面的内容,而不是一个值一个值的提交
function httpPostForm(frmID, URL, data, contentType) {
//alert(URL);
URL += ('?' + getFormQueryString(frmID));
//alert(URL);
this.init(URL,data,contentType);
return trim(this.httpObj.responseText);
}
function getFormQueryString( frmID ){
var i,queryString = "", and = "";
var item; // for each form's object
var itemValue;// store each form object's value
for( i=0;i<frmID.length;i++ ){
item = frmID[i];// get form's each object
if ( item.name!='' ){
if ( item.type == 'select-one' ){
itemValue = item.options[item.selectedIndex].value;
}else if ( item.type=='checkbox' || item.type=='radio'){
itemValue = item.value;
}else if ( item.type == 'button' || item.type == 'submit' ||tem.type == 'reset' ||
item.type == 'image'){
continue;
}else{
itemValue = item.value;
}
itemValue = encodeURIComponent(itemValue);
queryString += and + item.name + '=' + itemValue;
}
if ( item.checked == false ){
continue;
and="&";
}
}
return queryString;
}
JSP
function doCheckSubmit( actionUrl ){
var ajaxObj = new AjaxObject();
//actionUrl = actionUrl + "?userName=" + document.loginFrm.userName.value;
var res = ajaxObj.httpPostForm(loginFrm,actionUrl);
document.getElementById('checkResultDiv').innerHTML = '<B>' + res + '</B>';
}
相关推荐
利用ajax提交表单完整流程
利用jquery的ajax提交表单数据到后台。后台使用spring.
vue1/2 ajax提交表单
ajax提交表单,并对提交中文时的乱码进行处理.
完整的jq ajax提交表单，奖解压后jq文档加入页面中，调用就可惟了。 表单结构 <form id="myForm" action="comment.php" method="post"> Name: <input type="text" name="name" /> Comment: <...
Asp+ajax提交表单实例,很好用的啊.
ajax提交表单 作为一个小例子 大家如果感觉有用就看看
这是一个ajax提交表单插件，支持文件上传，用起来非常方便。具体使用说明 http://blog.csdn.net/qq122453418/article/details/79511164 欢迎留言
该例子是使用 Ajax 提交 Ext 表单，并通过 success 和 failer 返回相应的值。
开门见山,因为laravel以post形式提交数据时候需要加{{csrf_field()}}防止跨站攻击,所以当你用ajax提交表单时候自然也要加。 在网上看了很多的解决方式,我是用下面这种方法解决的: 1,首先在模板里面加上一个meta : ...
在jquery中ajax提交表单有post与get方式，在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了，下面我来介绍两个提交表单数据的方法。$get方式提交表单get() 方法通过远程HTTP ，下面我...
主要介绍了AJAX提交表单数据的方法,实例分析了Ajax调用的原理与实现技巧,需要的朋友可以参考下
本文实例讲述了jQuery使用$.ajax提交表单的方法。分享给大家供大家参考，具体如下： 首先，新建Login.html页面： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
该资源包含了一个使用jquery提交表单的代码，简单易懂，喜欢的下载。
用ajax技术将表单中的控件内容全部提交。
本篇文章主要是对ajax提交url与ajax提交表单的区别进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
jQuery.form.js是一个form插件，支持ajax表单提交和ajax文件上传.
Laravel-Bootstrap-Modal-Form, 使用AJAX提交模式中的Bootstrap 表单，使用 Laravel 验证 Laravel-Bootstrap-Modal-Form你的Laravel 应用程序的表单验证扩展插件。... 这里脚本保持模式打开，通过AJAX提交表单，查
主要介绍了thinkPHP5 ajax提交表单操作,结合实例形式分析了thinkPHP5的ajax提交表单操作技巧,并附带说明了表单提交中的参数传递与处理技巧,需要的朋友可以参考下