如何封装JS和CSS文件为服务器端控件

abcdef133

我们以封装一个JS的日期控件为列子，将它和服务器的TextBox结合在一起做成一个服务器控件，以达到直接托上去就可以使用的效果。其实很简单，大家共同学习。先看看效果图：




方法：
  首先：下载一个JS的日期组件，带封装。
  然后：建一个日期类文件CalendarBox.cs代码如下：

1.   using System;
   
2.   using System.Collections.Generic;
   
3.   using System.ComponentModel;
   
4.   using System.Text;
   
5.   using System.Web;
   
6.   using System.Drawing;
   
7.   using System.Web.UI;
   
8.   using System.Web.UI.WebControls;
   
9.   using System.Web.UI.HtmlControls;
   
10.    
    
11.   [assembly: WebResource("Wisesoft.Web.Control.Wisesoft.Calendar.calendar.js", "application/x-javascript", PerformSubstitution=true)]
    
12.    
    
13.   namespace Wisesoft.Web.Control
    
14.   {
    
15.    [ToolboxBitmap(typeof(CalenderBox), "Wisesoft.Calendar.CalendarBox.ico")]
    
16.    public class CalenderBox : TextBox
    
17.    {
    
18.    protected override void OnPreRender(EventArgs e)
    
19.    {
    
20.    string calendar = CalenderCSS.CSS;
    
21.    calendar = calendar.Replace("$ImaginURL$", this.ImaginURL);
    
22.    if (!Page.ClientScript.IsClientScriptBlockRegistered("_calendar"))
    
23.    Page.ClientScript.RegisterClientScriptBlock(typeof(string), "_calendar", calendar);
    
24.    
    
25.    this.Page.PreRenderComplete += new EventHandler(Page_PreRenderComplete);
    
26.    this.CssClass = "Wdate";
    
27.    this.Attributes.Add("onfocus","setday(this)");
    
28.    this.Attributes.Add("onchange", "checkDate(this.value)");
    
29.    base.OnPreRender(e);
    
30.    }
    
31.    
    
32.    void Page_PreRenderComplete(object sender, EventArgs e)
    
33.    {
    
34.    Page.ClientScript.RegisterClientScriptResource(this.GetType(), "Wisesoft.Web.Control.Wisesoft.Calendar.calendar.js");
    
35.    }
    
36.    
    
37.    /**////  
    
38.    /// 弹出日期控件小图片的地址
    
39.    ///  
    
40.    [Bindable(true)]
    
41.    [Category("图标设置")]
    
42.    [DefaultValue("imagin/calender.gif")]
    
43.    [Localizable(true)]
    
44.    public string ImaginURL
    
45.    {
    
46.    get
    
47.    {
    
48.    String s = (String)ViewState["ImaginURL"];
    
49.    return ((s == null) ? "imagin/calender.gif" : s);
    
50.    }
    
51.    set
    
52.    {
    
53.    ViewState["ImaginURL"] = value;
    
54.    }
    
55.    }
    
56.    
    
57.    /**////  
    
58.    /// 设置日期，时间的初始格式。
    
59.    ///  
    
60.    [Bindable(true)]
    
61.    [Category("初始化设置")]
    
62.    [DefaultValue(false)]
    
63.    [Localizable(true)]
    
64.    public bool ShowTime
    
65.    {
    
66.    get
    
67.    {
    
68.    bool s = (bool)ViewState["ShowTime"];
    
69.    if (ViewState["ShowTime"] != null)
    
70.    {
    
71.    return s;
    
72.    }
    
73.    return false;
    
74.    }
    
75.    set
    
76.    {
    
77.    ViewState["ShowTime"] = value;
    
78.    }
    
79.    }
    
80.    
    
81.    
    
82.    /**////  
    
83.    /// 注样式文件
    
84.    ///  
    
85.    ///  
    
86.    private void RegisterCssFile(string path)
    
87.    {
    
88.    HtmlLink link1 = new HtmlLink();
    
89.    link1.Attributes["type"] = "text/css";
    
90.    link1.Attributes["rel"] = "stylesheet";
    
91.    link1.Attributes["href"] = path;
    
92.    this.Page.Header.Controls.Add(link1);
    
93.    }
    
94.    }
    
95.   }  

复制代码