今天在网上看了一个例子挺有意思的,于是拿过来就研究了一下,又学到了不少的东西,主要的内容是Ajax.net和GridView交互。
在作的过程中碰见了这样的问题,就是回调函数不能嵌套使用,那么解决的办法呢有2种(我个人的所发现的,可能还有其他更好的方法)。
下面就把这个小东东写出来。
一,先把第一个简单的容易看懂的写出来
那么如果要使用回调函数会出现什么问题呢?先面就把不太正确的做法写出来,不是说不正确,而是离我们的想要的效果还有一段距离,.cs文件是一样的,唯独js的函数不一样了,我只把js的函数列出来
这样的话,虽然运行没问题,但是效果和第一个的就不一样,在插入后,页面不会把新插入的数据即时的显示出来,那么怎么办呢?
就是在CallBack函数里面改写一下程序,把LoadGV()改为window.setTimeout(LoadGV,100);这样一来就实现了相同的效果,同时呢又回到了我们熟悉的回调函数了。
另一种解决方法是把LoadGV所要执行的服务器的回调函数写道另一个.cs文件里面那么上面的js的文件就用改写了,只是要把方法掉对了。
有什么不妥当的地方,还请各位高手指点。
在作的过程中碰见了这样的问题,就是回调函数不能嵌套使用,那么解决的办法呢有2种(我个人的所发现的,可能还有其他更好的方法)。
下面就把这个小东东写出来。
一,先把第一个简单的容易看懂的写出来
1using System;
2using System.Data;
3using System.Configuration;
4using System.Collections;
5using System.Web;
6using System.Web.Security;
7using System.Web.UI;
8using System.Web.UI.WebControls;
9using System.Web.UI.WebControls.WebParts;
10using System.Web.UI.HtmlControls;
11using System.Data.SqlClient;
12
13namespace 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文件也很简单2using System.Data;
3using System.Configuration;
4using System.Collections;
5using System.Web;
6using System.Web.Security;
7using System.Web.UI;
8using System.Web.UI.WebControls;
9using System.Web.UI.WebControls.WebParts;
10using System.Web.UI.HtmlControls;
11using System.Data.SqlClient;
12
13namespace 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
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里面我们没有用回调的函数,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这个回调函数,那么就是回调函数嵌套了,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的文件就用改写了,只是要把方法掉对了。
有什么不妥当的地方,还请各位高手指点。