Ajax+Asp源代码]读取数据库内容的表格(没有用框架)


功能:
读取数据库内容的表格.读取数据方式为ajax,分页也是.代码写得不好.呵呵.供一些学习ajax的朋友参考参考.如有不妥请大家跟贴纠正.我会根据大家的提议不断修正代码.
目前还有一个小问题,如果有朋友有兴趣帮我解决一下在下不胜感激
你翻到最后一页的时候如果只有一行会出现空白和undefined.这个问题我试了很多方法一直没有很妥当的解决.
注:下面一些地方出现笑脸表情的是 大写的d
其实很多地方都可以根据asp文件中输出的字符来控制.目前还没有往那方面完善.比如说一列显示多少行等.
Asp页面的代码:
文件名:demo.Asp
复制代码 代码如下:

'下面这个Sub 是延迟用于调试ajax的loading
<%
Sub TimeDelaySeconds(DelaySeconds)
SecCount = 0
Sec2 = 0
While SecCount < DelaySeconds + 1
Sec1 = Second(Time())
If Sec1 <> Sec2 Then
Sec2 = Second(Time())
SecCount = SecCount + 1
End If
Wend
End Sub
TimeDelaySeconds(0)
%>

<%
Response.Expires = -9999
Response.AddHeader "Pragma","no-cache"
Response.AddHeader "cache-ctrol","no-cache"
Response.Charset = "GB2312"

Set conn = Server.CreateObject("ADODB.Connection")
connstr="Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.MapPath("Database.mdb")
conn.Open connstr
%>

<%
set rs = server.createobject("adodb.recordset")
Sqlstr = "select * from UserData order by id"
rs.open Sqlstr,conn,1,1
rs.PageSize = 3
AllPage = rs.PageCount

Page = request.QueryString ("page")

'***********************判断
if cint(page) =< 1 then
Page = 1
elseif cint(page) >= rs.PageCount then
Page = rs.PageCount
else
intpage = cint(page)
end if
'***************************

rs.AbsolutePage=page

Response.write AllPage&","&rs.AbsolutePage&","

for i = 1 to rs.PageSize
if rs.EOF or rs.BOF then exit for
Response.write rs(0)&","&rs(1)&","&rs(2)&","&rs(3)&","
rs.movenext
next

rs.close
Set rs = nothing
%>


ajax处理的页面代码
文件名:Ajax.js
复制代码 代码如下:

var request = false;
//------------------判断浏览器并建立对象----------------------------------------------------------------
try { //尝试创建 XMLHttpRequest 对象
request = new XMLHttpRequest(); //---此对象将兼容除IE外大部分浏览器!
} //-
catch (trymicrosoft) { //如果失败 catch (trymicrosoft)

try { //尝试使用较新版IE兼容的对象(Msxml2.XMLHTTP)
request = new ActiveXObject("Msxml2.XMLHTTP"); //---此对象将兼容老版本IE
} //-
catch (othermicrosoft) { //如果失败 catch (othermicrosoft)

try { //尝试使用较老版IE兼容的对象(Microsoft.XMLHTTP)
request = new ActiveXObject("Microsoft.XMLHTTP"); //---此对象将兼容新版本IE
} //-
catch (failed) { //如果失败 catch (failed)
request = false; //request = false
alert("Object Error!");
}
}
}
defaultPages();
//-------------------------------------------------------------------------------------------------------------*/


//**********读取数据***********************************************************

function defaultPages() {
var url = "Demo.asp";
request.open("GET", url, true); //open方法 ("方式",url,是否异步)
request.onreadystatechange = updatePage; //判断服务器处理的结果
request.send(null); //送出.
}

function selectPages(Method,Pages) {

//先删除以前的数据
for(i=0;i<3;i++)
document.getElementById("MyTable").deleteRow();
//----------------

if (Method == "Previous"){
var PageTemp = document.getElementById("PageNow").value;
var PageNow = parseInt(PageTemp)-1;

//alert (PageNow);//debug

var url = "Demo.asp?Page="+PageNow;
request.open("GET", url, true);
request.onreadystatechange = updatePage;
request.send(null);
}

else if (Method == "Next"){
var PageTemp = document.getElementById("PageNow").value;
var PageNow = parseInt(PageTemp)+1;

//alert (PageNow);//debug

var url = "Demo.asp?Page="+PageNow;
request.open("GET", url, true);
request.onreadystatechange = updatePage;
request.send(null);
}
}

//***********服务器是否处理完成.**********************************************************************************

function updatePage() {
if (request.readyState <= 3){ //小于或等于状态3----loading.
document.getElementById("Status").innerHTML = "Loading...";
document.getElementById("Pages").innerHTML = "Previous│Next";
}

if (request.readyState == 4){ //状态4----完成.
if (request.status == 200) { //如果http状态为200--当成功获取获取数据.
requestAllright();
}else{ //如果http状态为404--http报错.
document.getElementById("Status").innerHTML = "Error:" + request.status;
document.getElementById("Pages").innerHTML = "Previous│Next";
}
}
}

//***********处理完成-生成数据.**********************************************************************************

function requestAllright() {
var getStr = request.responseText;
var getValue = getStr.split(",");
var PageCount = getValue[0];
var PageNow = getValue[1];

var Contact = [
[getValue[2],getValue[3],getValue[4],getValue[5]],
[getValue[6],getValue[7],getValue[8],getValue[9]],
[getValue[10],getValue[11],getValue[12],getValue[13]]
];

for (var List=0;List<Contact.length;List++){
var MyTr = MyTable.insertRow(); //创建Tr标签
for (var Cell=0;Cell<Contact[List].length;Cell++){ //Td循环
var MyTd = MyTr.insertCell(); //创建Td标签
MyTd.innerHTML = Contact[List][Cell]; //给Td标签插入内容
if (Cell == 0) //如果当前为每行的第一个Td
MyTd.id = "Number"; //赋予其ID为Number
}
}

//上一页下一页处的判断,是否可以点击******************************************************************************************
if (PageNow == PageCount){
document.getElementById("Pages").innerHTML = "<a href=javascript:selectPages('Previous','0'); target=_self class=pagesTag>Previous</a>│Next"
}
else if (PageNow == 1){
document.getElementById("Pages").innerHTML = "Previous│<a href=javascript:selectPages('Next','0'); target=_self class=pagesTag>Next</a>"
}
else if (PageNow != 1 || PageNow != PageCount){
document.getElementById("Pages").innerHTML = "<a href=javascript:selectPages('Previous','0'); target=_self class=pagesTag>Previous</a>│<a href=javascript:selectPages('Next','0'); target=_self class=pagesTag>Next</a>"
}
//上一页下一页处的判断,是否可以点击******************************************************************************************

document.getElementById("PageCount").value = PageCount;
document.getElementById("PageNow").value = PageNow;
document.getElementById("Status").innerHTML = "Done with!";

//alert(PageCount);//debug
//alert(PageNow);//debug

}


« 
» 
快速导航

Copyright © 2016 phpStudy | 豫ICP备2021030365号-3