今天在网上看了一个例子挺有意思的,于是拿过来就研究了一下,又学到了不少的东西,主要的内容是Ajax.net和GridView交互。
在作的过程中碰见了这样的问题,就是回调函数不能嵌套使用,那么解决的办法呢有2种(我个人的所发现的,可能还有其他更好的方法)。
下面就把这个小东东写出来。
一,先把第一个简单的容易看懂的写出来
那么如果要使用回调函数会出现什么问题呢?先面就把不太正确的做法写出来,不是说不正确,而是离我们的想要的效果还有一段距离,.cs文件是一样的,唯独js的函数不一样了,我只把js的函数列出来
这样的话,虽然运行没问题,但是效果和第一个的就不一样,在插入后,页面不会把新插入的数据即时的显示出来,那么怎么办呢?
就是在CallBack函数里面改写一下程序,把LoadGV()改为window.setTimeout(LoadGV,100);这样一来就实现了相同的效果,同时呢又回到了我们熟悉的回调函数了。
另一种解决方法是把LoadGV所要执行的服务器的回调函数写道另一个.cs文件里面那么上面的js的文件就用改写了,只是要把方法掉对了。
有什么不妥当的地方,还请各位高手指点。
在作的过程中碰见了这样的问题,就是回调函数不能嵌套使用,那么解决的办法呢有2种(我个人的所发现的,可能还有其他更好的方法)。
下面就把这个小东东写出来。
一,先把第一个简单的容易看懂的写出来
1
using System;
2
using System.Data;
3
using System.Configuration;
4
using System.Collections;
5
using System.Web;
6
using System.Web.Security;
7
using System.Web.UI;
8
using System.Web.UI.WebControls;
9
using System.Web.UI.WebControls.WebParts;
10
using System.Web.UI.HtmlControls;
11
using System.Data.SqlClient;
12
13
namespace LoadGridView
14
{
15
public partial class Default6 : System.Web.UI.Page
16
{
17
protected void Page_Load(object sender, EventArgs e)
18
{
19
AjaxPro.Utility.RegisterTypeForAjax(typeof(Default6));
20
AjaxPro.Utility.RegisterTypeForAjax(typeof(tt.Demo));
21
}
22
[AjaxPro.AjaxMethod]
23
public string AddAjaxTable(string name)
24
{
25
System.Threading.Thread.Sleep(1000);
26
string strcon = "server=.;database=AjaxTable;uid=sa;pwd=lanjie";
27
SqlConnection con = new SqlConnection(strcon);
28
con.Open();
29
SqlCommand com = new SqlCommand();
30
com.CommandText = "insert into Ajaxtt values('" + name + "')";
31
com.Connection = con;
32
int result=com.ExecuteNonQuery();
33
con.Close();
34
com.Dispose();
35
return result.ToString();
36
}
37
[AjaxPro.AjaxMethod]
38
public string GetAjaxTable(int a )
39
{
40
System.Threading.Thread.Sleep(1000);
41
string strcon = "server=.;database=AjaxTable;uid=sa;pwd=lanjie";
42
SqlConnection con = new SqlConnection(strcon);
43
con.Open();
44
SqlCommand com = new SqlCommand();
45
com.CommandText = "select * from Ajaxtt";
46
com.Connection = con;
47
SqlDataAdapter dra = new SqlDataAdapter();
48
dra.SelectCommand = com;
49
DataSet ds = new DataSet();
50
dra.Fill(ds, "Ajaxtt");
51
con.Close();
52
com.Dispose();
53
GridView GV = new GridView();
54
GV.DataSource = ds;
55
GV.DataBind();
56
System.Text.StringBuilder strb = new System.Text.StringBuilder();
57
System.IO.StringWriter sw = new System.IO.StringWriter(strb);
58
System.Web.UI.HtmlTextWriter htw = new System.Web.UI.HtmlTextWriter(sw);
59
GV.RenderControl(htw);
60
string s = strb.ToString();
61
return s;
62
}
63
}
64
65
}
66
这是在后台页面的代码,很容易,那么在前台页面的js文件也很简单
using System;2
using System.Data;3
using System.Configuration;4
using System.Collections;5
using System.Web;6
using System.Web.Security;7
using System.Web.UI;8
using System.Web.UI.WebControls;9
using System.Web.UI.WebControls.WebParts;10
using System.Web.UI.HtmlControls;11
using System.Data.SqlClient;12

13
namespace LoadGridView14
{15
public partial class Default6 : System.Web.UI.Page16
{17
protected void Page_Load(object sender, EventArgs e)18
{19
AjaxPro.Utility.RegisterTypeForAjax(typeof(Default6));20
AjaxPro.Utility.RegisterTypeForAjax(typeof(tt.Demo));21
}22
[AjaxPro.AjaxMethod]23
public string AddAjaxTable(string name)24
{25
System.Threading.Thread.Sleep(1000);26
string strcon = "server=.;database=AjaxTable;uid=sa;pwd=lanjie";27
SqlConnection con = new SqlConnection(strcon);28
con.Open();29
SqlCommand com = new SqlCommand();30
com.CommandText = "insert into Ajaxtt values('" + name + "')";31
com.Connection = con;32
int result=com.ExecuteNonQuery();33
con.Close();34
com.Dispose();35
return result.ToString();36
}37
[AjaxPro.AjaxMethod]38
public string GetAjaxTable(int a )39
{40
System.Threading.Thread.Sleep(1000);41
string strcon = "server=.;database=AjaxTable;uid=sa;pwd=lanjie";42
SqlConnection con = new SqlConnection(strcon);43
con.Open();44
SqlCommand com = new SqlCommand();45
com.CommandText = "select * from Ajaxtt";46
com.Connection = con;47
SqlDataAdapter dra = new SqlDataAdapter();48
dra.SelectCommand = com;49
DataSet ds = new DataSet();50
dra.Fill(ds, "Ajaxtt");51
con.Close();52
com.Dispose();53
GridView GV = new GridView(); 54
GV.DataSource = ds;55
GV.DataBind();56
System.Text.StringBuilder strb = new System.Text.StringBuilder();57
System.IO.StringWriter sw = new System.IO.StringWriter(strb);58
System.Web.UI.HtmlTextWriter htw = new System.Web.UI.HtmlTextWriter(sw);59
GV.RenderControl(htw);60
string s = strb.ToString();61
return s;62
}63
}64
65
}66

1
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default6.aspx.cs" Inherits="LoadGridView.Default6" %>
2
3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
5
<html xmlns="http://www.w3.org/1999/xhtml" >
6
<head runat="server">
7
<title>邦定GridView</title>
8
<script language=javascript>
9
function AddAjax()
10
{
11
var name=document.getElementById("nametext").value;
12
LoadGridView.Default6.AddAjaxTable(name);
13
LoadGV();
14
15
}
16
function LoadGV()
17
{
18
document.getElementById("Gv").innerHTML= LoadGridView.Default6.GetAjaxTable(1).value;
19
}
20
</script>
21
</head>
22
<body onload="LoadGV();">
23
<div id="loading" style="display:none;" ><img src=9.gif /><div id="ss" ></div></div>
24
<form id="form1" runat="server">
25
<input type="text" id="nametext"/>
26
<input type="button" value="AjaxButton" onclick="AddAjax();" />
27
<div id="Gv">
28
29
</div>
30
</form>
31
</body>
32
</html>
33
这样就很容易的实现了Ajax和GridView的功能了,但是大家看看是不是和以前我们写的代码有点不一样呢?就是在js里面我们没有用回调的函数,
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default6.aspx.cs" Inherits="LoadGridView.Default6" %>2

3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">4

5
<html xmlns="http://www.w3.org/1999/xhtml" >6
<head runat="server">7
<title>邦定GridView</title>8
<script language=javascript>9
function AddAjax()10
{11
var name=document.getElementById("nametext").value;12
LoadGridView.Default6.AddAjaxTable(name);13
LoadGV(); 14
15
}16
function LoadGV()17
{18
document.getElementById("Gv").innerHTML= LoadGridView.Default6.GetAjaxTable(1).value; 19
}20
</script>21
</head>22
<body onload="LoadGV();">23
<div id="loading" style="display:none;" ><img src=9.gif /><div id="ss" ></div></div>24
<form id="form1" runat="server">25
<input type="text" id="nametext"/>26
<input type="button" value="AjaxButton" onclick="AddAjax();" />27
<div id="Gv">28
29
</div>30
</form>31
</body>32
</html>33

那么如果要使用回调函数会出现什么问题呢?先面就把不太正确的做法写出来,不是说不正确,而是离我们的想要的效果还有一段距离,.cs文件是一样的,唯独js的函数不一样了,我只把js的函数列出来
1
function AddAjax()
2
{
3
var name=document.getElementById("nametext").value;
4
LoadGridView.Default6.AddAjaxTable(name,CallBack);
5
6
}
7
function LoadGV()
8
{
9
LoadData();
10
tt.Demo.GetAjaxTable(1,CallServerBack);
11
}
12
function CallServerBack(res)
13
{
14
closeloading();
15
var cc=document.getElementById("Gv");
16
cc.innerHTML=res.value;
17
}
18
function CallBack(ss)
19
{
20
closeloading();
21
if(ss.value!=0)
22
{
23
LoadGV();
24
}
25
}
大家仔细看,在CalBack回调函数里面我们调用了LoadGv函数,而LoadGV函数确又调用CallServerBack这个回调函数,那么就是回调函数嵌套了,
function AddAjax()2
{3
var name=document.getElementById("nametext").value;4
LoadGridView.Default6.AddAjaxTable(name,CallBack); 5
6
}7
function LoadGV()8
{9
LoadData(); 10
tt.Demo.GetAjaxTable(1,CallServerBack); 11
}12
function CallServerBack(res)13
{14
closeloading();15
var cc=document.getElementById("Gv");16
cc.innerHTML=res.value;17
}18
function CallBack(ss)19
{20
closeloading();21
if(ss.value!=0)22
{23
LoadGV(); 24
} 25
}这样的话,虽然运行没问题,但是效果和第一个的就不一样,在插入后,页面不会把新插入的数据即时的显示出来,那么怎么办呢?
就是在CallBack函数里面改写一下程序,把LoadGV()改为window.setTimeout(LoadGV,100);这样一来就实现了相同的效果,同时呢又回到了我们熟悉的回调函数了。
另一种解决方法是把LoadGV所要执行的服务器的回调函数写道另一个.cs文件里面那么上面的js的文件就用改写了,只是要把方法掉对了。
有什么不妥当的地方,还请各位高手指点。


浙公网安备 33010602011771号