不知道大家有没有用过igoogle这个google的个人门户网站，我弄的这个东西就是模仿igoogle，主要的难点是新闻模块的动态生成和模块的拖放功能和位置保存。基本原理是用userControl去实现新闻的容器--新闻模块，模块的内容由RSS提供，ASP.Net AJAX实现模块的拖放和服务器的数据存储，js负责提供页面的动态信息交给服务器处理。

一、userControl编写

userControl负责存放新闻，我们为了可以重复使用给他填上了属性。这样根据不同的属性就可以让

userControl提供不同的新闻。
模块的信息来源是RSS然后通过程序分析XML中的信息放在userControl中。

后台代码如下：

userControl后台代码
 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 UI_Servers;
12 using DB_Servers;
13 using Castle.ActiveRecord;
14 using Castle.ActiveRecord.Framework;
15 
16 
17     //public delegate void ClickEventHandler(object sender, EventArgs e);
18     public partial class WebUserControl : System.Web.UI.UserControl
19     {
20         private string Cid;//用户控件ID
21         private string Rssid;//获得数据库中Rss链接的编号
22         private RSSChannel channel;//Rss新闻信息
23         private int count;
24         public string CID
25         {
26             get { return Cid; }
27             set { Cid = value; }
28         }
29         public string RSSID
30         {
31             get { return Rssid; }
32             set { Rssid = value; }
33         }
34 
35         public int Count
36         {
37             get { return count; }
38             set { count = value; }
39         }
40         protected void Page_Load(object sender, EventArgs e)
41         {
42             string url;
43             Rss RSS = Rss.Find(Convert.ToInt32(Rssid));//通过Rssid获得Rss实体类（使用了Castle AR技术，数据库层这里不多做介绍了）
44             channel = new RSSChannel(RSS.RssURL);//通过RSS的URL建立新闻列表实体。
45             channel.ReadChannel();//为新闻实体添加数据（从RSS的XML分析而来）
46         }
47         /// <summary>
48         /// 填充页面RSS新闻
49         /// </summary>
50         /// <returns></returns>
51         public string GetContent()
52         {
53             string ret = string.Empty;
54             RSSItem[] items = new RSSItem[channel.Items.Count];
55             int i = 0;
56             for (; i < count && i < channel.Items.Count; i++)
57             {
58                 items[i] = channel.Items[i];
59                 ret += "<li><a href=/"" + items[i].Link + "/" alt=/"" + items[i].Description + "/">" +
60                     items[i].Title +
61                     "</a></li>";
62             }
63             return ret;
64 
65         }
66         /// <summary>
67         /// RSS新闻模块标题填充
68         /// </summary>
69         /// <returns></returns>
70         public string Title()
71         {
72             return "<a href=/"" + channel.Link + "/" name=/"check/">" + channel.Title + "</a>";
73         }
74         /// <summary>
75         /// 生成拖动控件ID
76         /// 为以后ASP.Net AJAX的拖放注册准备
77         /// </summary>
78         /// <returns></returns>
79         public string DragID()
80         {
81             return Cid + "Drag";
82         }
83 
84 
85 

前台代码如下：

userControl前台代码
 1 <%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.cs" Inherits="WebUserControl" %>
 2 <div id="<%=CID %>" class="items">
 3         <div id="List_top" class="itemTop">
 4             <div id="<%=DragID() %>" class="itemTitle">
 5                 <%=Title() %>
 6             </div>
 7             <%--<asp:Button runat="server" ID="close_but"  Text="X" CssClass="closing" OnClientClick="elemClose(this);"/>--%>
 8             <input id="close_but" value="X" class="closing" onclick="elemClose(this);"  type="button"/>
 9         </div>
10                     <!-- 内容区域 OnClick="AButton_Click"-->
11         <div class="itemContent">
12             <ul>
13                 <%=GetContent() %>
14             </ul>
15         </div>
16         <div style="height:10px;"></div>
17 </div>
18

二、ASP.Net AJAX拖放编写

这里用到的是ASP.Net AJAX的拖放实现是依靠 ASP.Net AJAX CTP实现的，普通的ASP.Net AJAX 1.0是没有这个功能的。

在aspx页面上面加以下代码加载拖放的功能。

拖放功能加载
1     <asp:ScriptManager ID="sm" runat="server" EnablePageMethods="true">
2         <Scripts>
3             <asp:ScriptReference Assembly="Microsoft.Web.Preview" Name="PreviewScript.js" />
4             <asp:ScriptReference Assembly="Microsoft.Web.Preview" Name="PreviewDragDrop.js" />
5         </Scripts>
6     </asp:ScriptManager

现在拖放功能加载了，但是要告诉程序那个控件是可以拖放的，那个地方可以是投放控件的容器。ASP.Net AJAX CTP实现拖放需要用XML来注册控件的信息。下面是容器和容器注册的代码：

 下面介绍一下拖放时候的可以用到的两个触发事件：

1. Sys.Preview.UI.DragDropManager.add_dragStart(function(){})在拖拽开始的时候触发
2. Sys.Preview.UI.DragDropManager.add_dragStop(function(){})在拖拽结束的时候触发

括号里面是执行的函数。

三、新闻模块的动态生成

新闻模块既然已经被做成userControl，那么只要把userControl当做一个类实例化它，再通过页面初始化时候加载它就可以实现了。但是这个涉及到的问题就是如何在程序中将userControl当做类实例化，如何使其具有拖拽功能，又放在那里。

首先我们来解决userControl的实例化问题，有些朋友可能发现直接写出userControl的名字程序不认识，就算是放在一个解决方案中using这个方案也不行，其实这个是要在.aspx页面下面注册的，注册或就可以在.cs下面访问了，这个和加载其他第三方控件是一样的。需要在aspx的文件开头就注册好程序中才能使用，当然在Web.config文件中也可以注册。一下是两种注册方法：

这样解决了这个问题就可以动态实例化一个userControl了

Code
1 WebUserControl b = (WebUserControl)LoadControl("WebUserControl.ascx");
2                             b.CID = item.Trim();
3                             b.RSSID = item_data[1].Trim(); ;
4                             b.Count = Convert.ToInt32(item_data[2

设置了这些属性以后在程序调用实例化userControl，其初始化时候新闻信息就会添加在这个userControl中了。

下面是如何实现拖放功能，想让其有拖放功能在前面已经做好了其拖放容器好容器的注册，现在只需要将其加入注册就可以了，因为控件是动态生成的没有办法直接写在aspx代码里面我们用<%=函数名%>实现向aspx中添加注册代码的方式实现注册。把userControl的CID和DragID以上面的可拖放控件的注册方式生成一段注册字符串，再提供给函数就可以了，由于比较简单这里就不增加代码了。

四、JS对userControl的定位和位置存储。

这个是我编这个网站时候遇到的最大的问题，我在这里想了一个方法实现这个问题是一段字符串来记录的，因为每次用户的拖拽时间都要去改变本用户的页面设置，也就是说每次数据库都要有改动，都要和服务器有信息交换，为了不花销过多的服务器资源把大部分的计算工作留给了预览器即JS处理，然后将页面状况描述为一个二维数组，再由有服务器将数组变成字符串存储在个人的设置中。

字符串格式

JS会在每次拖放结束的时候执行，搜索所有的新闻模块，然后根据其位置经过计算处理整理出字符串。

JS处理代码如下：

最后是首页的源码可以更好的理解程序但是代码不能运行哦首页代码