0

做一个最简单的Web控件2-AddAttributesToRender

by 刘武 9. 十一月 2009 20:42

回顾上一篇的例子,如果我们直接在页面中添加该控件:<cc1:myhyperlink id="MyHyperLink1" runat="server"></cc1:myhyperlink>,那么浏览该页面的时候你会看到如下的HTML代码:<span id="MyHyperLink1"><a href="http://www.liuwu.net" target="_blank">Welcome To Liuwu.Net</a></span>,比我们预想的多了一个span标签,其实由于我们继承了WebControl类,该类会默认生成<span></span>容器。如果不需要该标签,我们可以重载TagKey属性和AddAttributesToRender方法: 

protected override HtmlTextWriterTag TagKey
{
    get
    {
        return HtmlTextWriterTag.A;
    }
}

protected override void AddAttributesToRender(HtmlTextWriter writer)
{
    writer.AddAttribute(HtmlTextWriterAttribute.Href, "http://www.liuwu.net");
    writer.AddAttribute(HtmlTextWriterAttribute.Target, "_blank");
    base.AddAttributesToRender(writer);
}

protected override void RenderContents(HtmlTextWriter output)
{
    output.Write("Welcome To Liuwu.Net");
}

TagKey属性指明了该控件最外层的标签,AddAttributesToRender方法则为该标签添加必要的属性,RenderContents方法在上一篇已经有介绍。重新浏览该页面,Span标签已经没有了。

Tags:

技术生涯

0

做一个最简单的Web控件

by 刘武 4. 十一月 2009 20:28

上一篇了解了asp.net服务器控件的生命周期,本篇来做一个最简单的实例。

首先建立新项目Liuwu.Net.WebControls,用来存放我所有的自定义控件。

然后在项目上右击,并选择添加>新建项,这里我们选择Web自定义控件,并为该控件命名为MyHyperLink,该控件将是一个类似这样的超链接:Welcome To Liuwu.Net

 Visual Studio 将为我们生成以下的模板:

namespace Liuwu.Net.WebControls
{
    [DefaultProperty("Text")]
    [ToolboxData("<{0}:MyHyperLink runat=server></{0}:MyHyperLink>")]
    public class MyHyperLink : WebControl
    {
        [Bindable(true)]
        [Category("Appearance")]
        [DefaultValue("")]
        [Localizable(true)]
        public string Text
        {
            get
            {
                String s = (String)ViewState["Text"];
                return ((s == null) ? String.Empty : s);
            }
            set
            {
                ViewState["Text"] = value;
            }
        } 

        protected override void RenderContents(HtmlTextWriter output)
        {
            output.Write(Text);
        }
    }
}

很多东西现在还不懂,不过没关系,现在我们只要明白控件开发的最终目的也就是将HTML代码输出到客户端,而RenderContents方法就是完成这个任务的。看看上面那个超链接,她的HTML代码是不是应该是 <a href="http://www.liuwu.net" target="_blank">Welcome To Liuwu.Net</a>呢,那我们只要在RenderContents方法中输入该代码就可以了。

以下是一种实现方式

[DefaultProperty("Text")]
[ToolboxData("<{0}:MyHyperLink runat=server></{0}:MyHyperLink>")]
public class MyHyperLink : WebControl

    protected override void RenderContents(HtmlTextWriter output)
    {
        output.Write("<a href=\"http://www.liuwu.net\""+
            "target=\"_blank\">Welcome To Liuwu.Net</a>");
    }
}

这里用了HtmlTextWriter的Write方法直接输出HTML代码(为了显示方便,这里将字符串拆开了)。

编译该项目,并添加网站,在工具栏中就能看到刚才编写的控件了,直接拖到页面上就可以使用,具体过程就不在累赘了。

除了该方法,我们还可以利用服务器控件的RenderControl方法输出控件

HtmlGenericControl a = new HtmlGenericControl("a");
a.Attributes.Add("href", "http://www.liuwu.net");
a.Attributes.Add("target", "_blank");
a.InnerText = "Welcome To Liuwu.Net";
a.RenderControl(output);

注意这里要引入System.Web.UI.HtmlControls命名空间,和第一种方法比起来,该方法显然没那么容易出错,不过也不是十全十美。

下面再介绍第三种方法

output.AddAttribute(HtmlTextWriterAttribute.Href,"http://www.liuwu.net");
output.AddAttribute(HtmlTextWriterAttribute.Target, "_blank");
output.RenderBeginTag(HtmlTextWriterTag.A);
output.Write("Welcome To Liuwu.Net");
output.RenderEndTag();

这里分别使用了HtmlTextWriterAttribute和HtmlTextWriterTag枚举,进一步避免了出错的可能。不过要注意,如果要为标签添加属性,则必须在RenderBeginTag方法之前调用AddAttribute方法。

 

Tags:

技术生涯

0

Javascript操作下拉框的常用方法

by 刘武 3. 十一月 2009 22:43

项目中碰到需要用javascript操作下拉框的情况,顺便做一下总结,列出一些常用方法,以下方法均在FIRFOX3.5及IE8上测试过,如有其他浏览器无法正常运行的请与笔者联系。

/*添加一个下拉框*/
function AddDropDownList(id,fatherCtl)
{
    if(!document.getElementById(id))
    {
        var ddl = document.createElement('select');
        ddl.setAttribute("id",id);  
        if(fatherCtl&&document.getElementById(fatherCtl))
            document.getElementById(fatherCtl).appendChild(ddl);
        else
            document.body.appendChild(ddl);
     }
}

/*删除指定的下拉框*/
function RemoveDropDownList(id)
{
      var ctl = document.getElementById(id);
      if(ctl)
        ctl.parentNode.removeChild(ctl);
}

/*给下拉框添加选项*/
function AddDDDLOption(id,text,value)
{
    var ctl = document.getElementById(id);
    if(ctl)
    {
        ctl.options[ctl.options.length]   =   new   Option(text,value); 
    }
}

/*删除所有选项*/
function RemoveAllDDLOptions(id)
{
    var ctl = document.getElementById(id);
    if(ctl)
    {
        ctl.options.length=0;
    }
}

/*删除指定索引的选项*/
function RemoveDDLOption(id,index)
{
    var ctl=document.getElementById(id);
    if(ctl && ctl.options[index])
    {
        ctl.options[index]=null;
    }
}

/*获取下拉框选择的值*/
function GetDDLSelectedValue(id)
{
    var ctl = document.getElementById(id);
    if(ctl)
    {
        return ctl.options[ctl.selectedIndex].value;
    }
}

/*获取下拉框选择的文本*/
function GetDDLSelectedText(id)
{
    var ctl = document.getElementById(id);
    if(ctl)
    {
        return ctl.options[ctl.selectedIndex].text;
    }
}

Tags:

技术生涯

Powered by BlogEngine.NET 1.6.1.9  登录
Original Design by Laptop Geek, Adapted by onesoft