一個簡單的Ajax例子
來源:互聯網
上載者:User
(1)Ajax.js 檔案代碼
function DoplstAjaxChenged()
{
var myAjax = window.Form1 ;
GetNames(myAjax.DoplstAjax.value);
}
function GetNames(DoplstID)
{
requestURL = "../AjaxFrontEnd/DoplstID.aspx?DoplstID=";
var URL =requestURL+DoplstID;
XmlHttp=CreateXMlHttpObject(UpdateLabel);
XmlHttpGet(XmlHttp,URL);
}
function UpdateLabel()
{
if(XmlHttp.readyState==4 || XmlHttp.readyState=='complete')
{
var str = XmlHttp.responseText;
document.getElementById ('LblAjax').innerText = str;
}
}
function CreateXMlHttpObject(funtionCall)
{
var objXmlHttp = null;
var strobjName = "Microsoft.XmlHttp";
objXmlHttp=new ActiveXObject(strobjName)
objXmlHttp.onreadystatechange=funtionCall;
return objXmlHttp;
}
function XmlHttpGet(httpObj,url)
{
httpObj.Open('GET',url,true);
httpObj.send(null);
}
(2)Ajax.xml 檔案代碼
<?xml version="1.0" encoding="utf-8" ?>
<NameStore>
<mateName>
<Name>請選擇名字</Name>
<Value>-1</Value>
</mateName>
<mateName>
<Name>孫璐</Name>
<Value>0</Value>
</mateName>
<mateName>
<Name>宋昀</Name>
<Value>1</Value>
</mateName>
<mateName>
<Name>王青</Name>
<Value>2</Value>
</mateName>
</NameStore>
(3)一個基類testAjax.cs代碼.
public static string floorResident(int floorId)
{
string names = string.Empty;
switch (floorId)
{
case 0:
names = "My beautiful beacher!";
break;
case 1:
names = "a beautiful gril!";
break;
case 2:
names = "a beautiful gril,too!";
break;
default :
names = " Please select a name!";
break;
}
return names;
}
(4)主表單的HTML 頁面內容
<%@ Page language="c#" Codebehind="TestAjax.aspx.cs" AutoEventWireup="false" Inherits="AjaxFrontEnd.TestAjax" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>TestAjax</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
<script language ="javascript" src =Ajax.js></script>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:DropDownList id="DoplstAjax" style="Z-INDEX: 101; LEFT: 328px; POSITION: absolute; TOP: 168px"
runat="server" onChange="DoplstAjaxChenged()">
</asp:DropDownList>
<asp:Label id="LblAjax" style="Z-INDEX: 102; LEFT: 328px; POSITION: absolute; TOP: 216px" runat="server">Label</asp:Label>
</form>
</body>
</HTML>
主表單的.cs 頁面代碼.
private void Page_Load(object sender, System.EventArgs e)
{
// 在此處放置使用者代碼以初始化頁面
DataSet Ds = new DataSet ();
string XmlPath=Server.MapPath ("Ajax.xml");
Ds.ReadXml (XmlPath);
this.DoplstAjax .DataSource = Ds.Tables [0];
this.DoplstAjax .DataTextField ="Name";
this.DoplstAjax .DataValueField ="Value";
this.DoplstAjax .DataBind ();
}
副表單的cs頁面代碼.
private void Page_Load(object sender, System.EventArgs e)
{
// 在此處放置使用者代碼以初始化頁面
int DoplstID = 0;
try
{
if (Request.QueryString["DoplstID"] != null)
{
DoplstID = Convert.ToInt32(Request.QueryString["DoplstID"]);
}
}
catch
{
DoplstID = 0;
}
string result = testAjax .DoplstNames(DoplstID);
Response.Write(result);
}