通过Ajax技术实现无刷新的更新数据表格
HTML代码(WebForm1.aspx)
服务端代码(另外一个aspx.cs文件WebForm2.aspx)
<HTML>
<HEAD>
<title>WebForm2</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<script language="javascript">
var xmlHttp;
function getdata()
{
xmlHttp=new ActiveXObject("MSXML2.XMLHTTP");
xmlHttp.onreadystatechange=getread;
xmlHttp.Open("GET","AjaxProcess.aspx",true);
xmlHttp.Send();
}
function getread()
{
if (xmlHttp.readyState==4)
{
if (xmlHttp.status==200)
{
var xmlReturn=xmlHttp.responseXML;
var node=xmlReturn.selectSingleNode("//NewDataSet").childNodes;
var tbody=document.createElement("tbody");
for (var i=0;i<node.length;i++)
{
var cnode=node[i].childNodes;
var tmpTr= document.createElement("tr");
for(var j=0;j<cnode.length;j++)
{
if ((cnode[j].nodeName=="c_id") || (cnode[j].nodeName=="c_name"))
{
var tmpTd= document.createElement("td");
tmpTd.setAttribute("style.WIDTH","50px");
tmpTd.innerText=cnode[j].text
tmpTr.appendChild(tmpTd);
}
}
tbody.appendChild(tmpTr);
}
document.getElementById("DataGrid2").appendChild(tbody);
}
else
{
alert("xmlHttp.status="+xmlHttp.status);
}
}
}
</script>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<INPUT style="Z-INDEX: 101; LEFT: 32px; POSITION: absolute; TOP: 40px" onclick="getdata()"
type="button" value="Button">
<table id="DataGrid2" style="Z-INDEX: 102; LEFT: 32px; WIDTH: 344px; POSITION: absolute; TOP: 72px; HEIGHT: 24px">
<TR>
<TD style="WIDTH: 122px">机构号</TD>
<TD style="WIDTH: 50px">机构名</TD>
</TR>
</table>
</form>
</body>
</HTML>
<HEAD>
<title>WebForm2</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<script language="javascript">
var xmlHttp;
function getdata()
{
xmlHttp=new ActiveXObject("MSXML2.XMLHTTP");
xmlHttp.onreadystatechange=getread;
xmlHttp.Open("GET","AjaxProcess.aspx",true);
xmlHttp.Send();
}
function getread()
{
if (xmlHttp.readyState==4)
{
if (xmlHttp.status==200)
{
var xmlReturn=xmlHttp.responseXML;
var node=xmlReturn.selectSingleNode("//NewDataSet").childNodes;
var tbody=document.createElement("tbody");
for (var i=0;i<node.length;i++)
{
var cnode=node[i].childNodes;
var tmpTr= document.createElement("tr");
for(var j=0;j<cnode.length;j++)
{
if ((cnode[j].nodeName=="c_id") || (cnode[j].nodeName=="c_name"))
{
var tmpTd= document.createElement("td");
tmpTd.setAttribute("style.WIDTH","50px");
tmpTd.innerText=cnode[j].text
tmpTr.appendChild(tmpTd);
}
}
tbody.appendChild(tmpTr);
}
document.getElementById("DataGrid2").appendChild(tbody);
}
else
{
alert("xmlHttp.status="+xmlHttp.status);
}
}
}
</script>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<INPUT style="Z-INDEX: 101; LEFT: 32px; POSITION: absolute; TOP: 40px" onclick="getdata()"
type="button" value="Button">
<table id="DataGrid2" style="Z-INDEX: 102; LEFT: 32px; WIDTH: 344px; POSITION: absolute; TOP: 72px; HEIGHT: 24px">
<TR>
<TD style="WIDTH: 122px">机构号</TD>
<TD style="WIDTH: 50px">机构名</TD>
</TR>
</table>
</form>
</body>
</HTML>
服务端代码(另外一个aspx.cs文件WebForm2.aspx)
private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
SqlConnection sqlconn=new SqlConnection("Initial Catalog=myDataBase;Data Source=192.168.0.166;UID=sa;PWD=123");
SqlCommand sqlcomm=new SqlCommand("select * from tb_table",sqlconn);
System.Data.SqlClient.SqlDataAdapter adapter=new SqlDataAdapter();
adapter.SelectCommand=sqlcomm;
DataSet ds=new DataSet();
sqlconn.Open();
adapter.Fill(ds);
Response.ContentType="text/xml";
Response.Write(ds.GetXml());
}
{
// 在此处放置用户代码以初始化页面
SqlConnection sqlconn=new SqlConnection("Initial Catalog=myDataBase;Data Source=192.168.0.166;UID=sa;PWD=123");
SqlCommand sqlcomm=new SqlCommand("select * from tb_table",sqlconn);
System.Data.SqlClient.SqlDataAdapter adapter=new SqlDataAdapter();
adapter.SelectCommand=sqlcomm;
DataSet ds=new DataSet();
sqlconn.Open();
adapter.Fill(ds);
Response.ContentType="text/xml";
Response.Write(ds.GetXml());
}