利用xmlhttp无刷新添加数据之get篇.
我们传统的提交数据的方法都是用<form>来实现的.
<form>标记中的method属性确定了表单元素的数据在发送到服务器时,
如何对http请求信息进行打包.
method 属性可以使用的方法
method属性 发送表单元素的方式 读取数据的request集合
get 标识在url的最后 querystring
post 在http请求的主体内(http请求的自由区域) form
这篇文章用xmlhttp来实现form的method=get.
clientget.htm
<script language="javascript">
function adddataget(suserid,susername)
{
/*
*--------------- adddataget(suserid,susername) -----------------
* adddataget(suserid,susername)
* 功能:通过xmlhttp添加数据.相当于form的method=get.
* 参数:suserid,字符串,发送条件.
* 参数:susername,字符串,发送条件.
* 实例:adddataget(document.all.userid.value,document.all.username.value);
* author:wanghr100(灰豆宝宝.net)
* update:2004-5-30 14:46
*--------------- adddataget(suserid,susername) -----------------
*/
var obao = new activexobject("microsoft.xmlhttp");
//特殊字符：+,%,&,=,?等的传输解决办法.用escape编码.
//update:2004-6-1 12:22
//escape(suserid),escape(susername);
obao.open("post","server.asp?userid="+escape(suserid)+"&username="+escape(susername),false);
obao.send();
//清空输入框数据.
document.all.userid.value="";
document.all.username.value="";
//服务器端处理返回的是经过escape编码的字符串.
alert(unescape(obao.responsetext))
}
</script>
<input type="button" onclick="adddataget(document.all.userid.value,document.all.username.value)" value="adddataget"><br>
userid:<input type="text" name="userid"><br>
username:<input type="text" name="username">
server.asp 服务器端处理.
<% @language="javascript" %>
<%
function opendb(sdbname)
{
/*
*--------------- opendb(sdbname) -----------------
* opendb(sdbname)
* 功能:打开数据库sdbname,返回conn对象.
* 参数:sdbname,字符串,数据库名称.
* 实例:var conn = opendb("database.mdb");
* author:wanghr100(灰豆宝宝.net)
* update:2004-5-12 8:18
*--------------- opendb(sdbname) -----------------
*/
var connstr = "provider=microsoft.jet.oledb.4.0; data source="+server.mappath(sdbname);
var conn = server.createobject("adodb.connection");
conn.open(connstr);
return conn;
}
var sresult = "";
var oconn = opendb("data.mdb");
//相当于form的method=get.
//相当于form的method=get.
//特殊字符：+,%,&,=,?等的传输解决办法.客户端传输过来是经过escape编码的.
//所以服用器端应该先用unescape解码.
//update:2004-6-1 12:22
//unescape(request.querystring("userid")).....
var userid = unescape(request.querystring("userid"));
var username = unescape(request.querystring("username"));
sresult = "userid:"+userid+"/nusername:"+username+"/n 添加成功."
var sql = "insert into users(userid,username)values('"+userid+"','"+username+"')";
oconn.execute(sql);
response.write(escape(sresult));
%>
|||xmlhttp来实现form的method=post.
clientpost.htm
<script language="javascript">
function adddatapost(suserid,susername)
{
/*
*--------------- adddatapost(suserid,susername) -----------------
* adddatapost(suserid,susername)
* 功能:通过xmlhttp添加数据.相当于form的method=post.
* 参数:suserid,字符串,发送条件.
* 参数:susername,字符串,发送条件.
* 实例:adddatapost(document.all.userid.value,document.all.username.value);
* author:wanghr100(灰豆宝宝.net)
* update:2004-5-30 14:46
*--------------- adddatapost(suserid,susername) -----------------
*/
var obao = new activexobject("microsoft.xmlhttp");
//特殊字符：+,%,&,=,?等的传输解决办法.
//update:2004-6-1 12:22
//escape(suserid),escape(susername);
suserid = escape(suserid);
susername = escape(susername);
var userinfo = "userid="+suserid+"&username="+susername;
obao.open("post","server.asp",false);
obao.setrequestheader("content-type","application/x-www-form-urlencoded")
obao.send(userinfo);
//清空输入框数据.
document.all.userid.value="";
document.all.username.value="";
//服务器端处理返回的是经过escape编码的字符串.
alert(unescape(obao.responsetext))
}
</script>
<input type="button" onclick="adddatapost(document.all.userid.value,document.all.username.value)" value="adddatapost"><br>
userid:<input type="text" name="userid"><br>
username:<input type="text" name="username">
server.asp 服务器端处理.
<% @language="javascript" %>
<%
function opendb(sdbname)
{
/*
*--------------- opendb(sdbname) -----------------
* opendb(sdbname)
* 功能:打开数据库sdbname,返回conn对象.
* 参数:sdbname,字符串,数据库名称.
* 实例:var conn = opendb("database.mdb");
* author:wanghr100(灰豆宝宝.net)
* update:2004-5-12 8:18
*--------------- opendb(sdbname) -----------------
*/
var connstr = "provider=microsoft.jet.oledb.4.0; data source="+server.mappath(sdbname);
var conn = server.createobject("adodb.connection");
conn.open(connstr);
return conn;
}
var sresult = "";
var oconn = opendb("data.mdb");
//相当于form的method=post.
//相当于form的method=post.
//特殊字符：+,%,&,=,?等的传输解决办法.客户端传输过来是经过escape编码的.
//所以服用器端应该先unescape解码.
//update:2004-6-1 12:22
//unescape(request.form("userid")).....
var userid = unescape(request.form("userid"));
var username = unescape(request.form("username"));
sresult = "userid:"+userid+"/nusername:"+username+"/n 添加成功."
var sql = "insert into users(userid,username)values('"+userid+"','"+username+"')";
oconn.execute(sql);
response.write(escape(sresult));
%>
数据库设计
data.mdb
表users.
字段
id 自动编号
userid 文本
username 文本
表:users 数据:
id userid username
1 wanghr100 灰豆宝宝.net
