您好,欢迎访问一九零五行业门户网

Ajax+PHP 边学边练之四 表单_PHP

ajax
谈到form就涉及到一个发送请求方式问题(get和post),对于get和post的使用和区别在本文就不详细说明了,一般对于web开发由于post传值为隐式且传输数据量较大所以比较常用。在本例中对functions.js进行下修改,将创建xmlhttp对象程序创建为一个函数processajax。
复制代码 代码如下:
function processajax (serverpage, obj, getorpost, str){
//将创建xmlhttprequest对象写到getxmlhttp()函数中,并获取该对象
xmlhttp = getxmlhttp ();
//get方式(和前面几篇一样)
if (getorpost == get){
xmlhttp.open(get, serverpage);
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readystate == 4 && xmlhttp.status == 200){
obj.innerhtml = xmlhttp.responsetext;
}
}
xmlhttp.send(null);
}
//post方式
else{
//第三个true参数将打开异步功能
xmlhttp.open(post, serverpage, true);
//创建post请求
xmlhttp.setrequestheader(content-type,application/x-www-form-urlencoded; charset=gb2312);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readystate == 4 && xmlhttp.status == 200) {
obj.innerhtml = xmlhttp.responsetext;
}
}
//表单(form)传值
xmlhttp.send(str);
}
}
在下图中当点击“submit”按钮后会激发submitform函数(functions.js),在该函数中会通过getformvalues函数检查form内容是否都填写完毕,否则提示哪项未填写。当检查通过后会调用process_task.php程序,它会将form值写入数据库。
submitform 函数:
复制代码 代码如下:
function submitform (theform, serverpage, objid, valfunc){
var file = serverpage;
//检查form值
var str = getformvalues(theform,valfunc);
//form全部填写
if (aok == true){
obj = document.getelementbyid(objid);
//运行ajax进行传值
processajax(serverpage, obj, post, str);
}
}
getformvalues 函数:
复制代码 代码如下:
function getformvalues (fobj, valfunc){
var str = ;
aok = true;
var val;    
//遍历form中所有对象
for(var i = 0; i if(valfunc){
if (aok == true){
val = valfunc (fobj.elements[i].value,fobj.elements[i].name);
if (val == false){
aok = false;
}
}
}
str += fobj.elements[i].name + = + escape(fobj.elements[i].value) + &;
}
//将form值以string形式返回
return str;
}
process_task.php 程序:
复制代码 代码如下:
源代码下载
其它类似信息

推荐信息