(一)?.?運行示例效果

* 運行后用鼠標拖動藍色的<馬>到任意位置, 將瀏覽器關閉后, 再重新訪問本頁面, 會發現<馬>仍然在您拖到的位置????????

(二). AjaxPro.NET簡介

???????? 首先對AjaxPro.NET作一下介紹, AjaxPro.NET是一個優秀的Ajax框架, 在實際應用中只要添加其DLL

???????? 引用并進行簡單的配置,?即可以非常方便的在客戶端直接調用服務端方法, 來獲取Tree節點.

(三).使用AjaxPro.NET預配置

?????? 1. 添加 AjaxPro.dll 文件的引用(示例代碼中已經包含,直接COPY過來使用即可).

?????? 2. 在Web.config文件中添加以下配置,???????????

1?<httpHandlers>
2?????????????<add?verb="POST,GET"?path="ajaxpro/*.ashx"?type="AjaxPro.AjaxHandlerFactory,?AjaxPro"?/>????????????
3 </httpHandlers> 3. 在要使用AjaxPro.NET框架的頁面 *.aspx.cs 的 Page_Load事件中加如下代碼: AjaxPro.Utility.RegisterTypeForAjax(typeof(_Default)); 4. 經過以上三步驟后, 只要在后臺服務端的方法前面增加屬性[AjaxMethod]后: ?1??[AjaxMethod()]????//?or?[AjaxPro.AjaxMethod]?
?2?public?ArrayList?GetSearchItems(?string?strQuery?)
?3?{
?4??????//生成數據源
?5??????ArrayList?items?=?new?ArrayList();
?6??????items.Add("King");
?7??????items.Add("Rose");
?8??????return?items?;
?9?}?
10? 就可以在客戶端直接使用服務端方法, 非常方便, 客戶端調用后臺代碼如下: var?returnValue?=?后臺代碼類名.GetSearchItems(參數);

(四). 代碼

?????? 1. 頁面前臺文件 AjaxDrag.aspx 代碼如下:

?1?<head?runat="server">
?2?????<title>Drag?controls</title>
?3?????<script?language="javascript"?src="dom-drag.js"></script>
?4?</head>
?5?<body?onload="javascript:ReadPosition();">
?6?????<form?id="form1"?runat="server">
?7?????<div>
?8?????????<table?style="width:?839px;?height:?550px"
?9????????????????background="http://blog.csdn.net/images/blog_csdn_net/chengking/XiangQi.JPG">
10?????????????<tr>
11?????????????????<td?style="width:?3px;?height:?394px;"?align="left"?atomicselection="false"?valign="top"
12?????????????????????background="http://blog.csdn.net/images/blog_csdn_net/chengking/XiangQi.JPG">
13?????????????????????<asp:Image?ID="Image1"?runat="server"?ImageAlign="Middle"?ImageUrl="~/blue-ma.gif"
14??????????????????????????style="cursor:hand;position:absolute;display:none"?/>
15????????????????</td>
16?????????????</tr>
17?????????</table>????????????
18????</div>??
19?????</form>
20?????<script?language="javascript">???????????
21?????????var?Image1?=?document.getElementById("Image1");
22?????????Drag.init(Image1);????????
23?????????Image1.onDragEnd?=?function(x,?y)
24?????????{
25?????????????WritePosition(x,?y);
26?????????}?????
27?????????
28?????????function?WritePosition(x,y)
29?????????{
30?????????????_Default.WritePosition(x,?y);
31?????????}?????????
32?????????
33?????????function?ReadPosition()
34?????????{
35?????????????window.setTimeout("_Default.ReadPosition(ReadPosition_callback)",600)????????????
36?????????}
37?????????
38?????????function?ReadPosition_callback(response)????????
39?????????{????????????
40?????????????var?value?=?response.value;???????????????
41?????????????Image1.style.left?=?value.X;
42?????????????Image1.style.top??=?value.Y;?
43?????????????Image1.style.display?=?'';
44?????????}?????????
45?????</script>????????
46?</body>

?????? 2. 頁面后臺文件 AjaxDrag.aspx.cs 代碼如下:

?1?public?partial?class?_Default?:?System.Web.UI.Page?
?2?{
?3?????protected?void?Page_Load(object?sender,?EventArgs?e)
?4?????{
?5????????Utility.RegisterTypeForAjax(typeof(_Default));???????
?6?????}
?7?
?8????[AjaxPro.AjaxMethod]
?9????public?void?WritePosition(int?x,?int?y)
10????{
11???????string?strFileName?=?this.GetFileName();
12???????if?(File.Exists(strFileName))
13???????{
14??????????StreamWriter?sw?=?new?StreamWriter(strFileName,?false,?System.Text.Encoding.UTF8);
15??????????sw.WriteLine(x.ToString()?+?","?+?y.ToString());
16??????????sw.Flush();
17??????????sw.Close();
18???????}????????????
19????}
20?
21????[AjaxPro.AjaxMethod]
22????public?Point?ReadPosition()
23????{
24???????StreamReader?sr?=?new?StreamReader(this.GetFileName(),?System.Text.Encoding.Default);
25???????string?str_X_Y?=?"";
26???????while?(sr.Peek()?>=?0)
27???????{
28??????????str_X_Y?=?sr.ReadLine();
29??????????break;
30???????}
31???????sr.Close();???
32???????
33???????string[]?str_x_y?=?str_X_Y.Split(',');
34???????Point?p?=?new?Point();
35???????p.X?=?int.Parse(str_x_y[0]);
36???????p.Y?=?int.Parse(str_x_y[1]);
37?
38???????return?p;??????
39????}
40?
41????private?string?GetFileName()
42????{
43???????string?rootCatoryName?=?"AjaxDragControl";
44???????string?strPath?=?Server.MapPath(".");
45???????strPath?=?strPath.Substring(0,?strPath.IndexOf(rootCatoryName)?+?rootCatoryName.Length);
46???????string?strFileName?=?Path.Combine(strPath,?"save.txt");
47???????return?strFileName;
48????}
49?}

(五). 示例代碼下載

???????? http://www.cnitblog.com/Files/ChengKing/AjaxDragControl.rar

(六). 相關文章請看

????????? 1. 在WinForm中實現拖動效果, 請看:

????????????? ?http://blog.csdn.net/chengking/archive/2005/10/07/496739.aspx

????????? 2. 使用鍵盤模擬鼠標, 請看:

?????????????? http://blog.csdn.net/chengking/archive/2005/10/07/496715.aspx

轉載于:https://www.cnblogs.com/MVP33650/archive/2007/04/27/730324.html

總結

以上是生活随笔為你收集整理的Ajax 实现在WebForm中拖动控件并即时在服务端保存状态数据 (Asp.net 2.0)(示例代码下载)...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。