日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學無先后,達者為師

網站首頁 編程語言 正文

ASP.NET中的Web控件介紹_基礎應用

作者:springsnow ? 更新時間: 2022-07-01 編程語言

一、HTML控件

就是我們通常的說的html語言標記,這些語言標記在已往的靜態頁面和其他網頁里存在,不能在服務器端控制的,只能在客戶端通過javascript等程序語言來控制。

<input type="button" id="btn" value="button"/>

二、HTML服務器控件

其實就是html控件的基礎上加上runat="server"所構成的控件。它們的主要區別是運行方式不同,html控件運行在客戶端,而html服務器控件是運行在服務器端的。

當ASP.NET網頁執行時,會檢查標簽有無runat屬性,如果標簽沒有設定,那么Html標簽就會被視為字符串,并被送到字符串流等待送到客戶端,客戶端的瀏覽器會對其進行解釋;如果Html標簽有設定runat="server" 屬性,Page對象會將該控件放入控制器,服務器端的代碼就能對其進行控制,等到控制執行完畢后再將Html服務器控件的執行結果轉換成Html標簽,然后當成字符串流發送到客戶端進行解釋,不能通過js來控制它。因為當控件屬性中有runat="server"時,生成的html控件時name和id發生的變化。

HTML 服務器控件 (HTML server control)屬于 System.Web.UI.HtmlControls 命名空間的 ASP.NET 服務器控件。

<form runat="server">
 <input runat="server" type="button" id="delete" value="Server button" onserverclick="delete_ServerClick" />
 <input type="button" onclick="return DeleteCheck(this)" id="Button1" value="Client button" />
 <input runat="server" type="submit" onclick="return DeleteCheck(this)" id="Button2" value="Server submit" />
 <input type="submit" onclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
 <button runat="server" id="button4" onclick="return DeleteCheck(this)" value="Button-Button">Button-Button</button>
</form>

生成的html代碼:

當html服務器控件在服務器端添加了服務器事件(onserverclick)后客戶端生成的代碼變為:onclick="_doPostBack()",實際上是調用腳本把整個窗體提交到服務器(如果沒有添件服務器事件而只是添加了runat="server"是不會發送到服務器端的)

<form>
 <input language="javascript" onclick="__doPostBack('delete','')" name="delete" type="button" id="delete" value="Server button" />
 <input type="button" onclick="return DeleteCheck(this)" id="Button1" value="Client button" />
 <input name="Button2" type="submit" id="Button2" onclick="return DeleteCheck(this)" value="Server submit" />
 <input type="submit" onclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
 <button id="button4" onclick="return DeleteCheck(this)" value="Button-Button">Button-Button</button>
</form>

JS腳本:

<script type="text/javascript">
<!--
var theForm = document.forms['form1'];
if (!theForm) {
 theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
 if (!theForm.onsubmit    (theForm.onsubmit() != false)) {
   theForm.__EVENTTARGET.value = eventTarget;
   theForm.__EVENTARGUMENT.value = eventArgument;
   theForm.submit();
  }
}
// -->
</script>

HTML控件,如IMG的輸入按鈕等 的 onclick ( 客戶端 )和 onserverclick( 服務端 )事件,注意 runat="server"。此處的onclick先于onserverclick執行。

三、Web服務器控件

也稱asp.net服務器控件,是Web Form編程的基本元素,也是asp.net所特有的。它會按照client的情況產生一個或者多個html控件,而不是直接描述html元素。

Web 服務器控件比 HTML 服務器控件更豐富、更抽象。Web 服務器控件在 asp.net 頁上有 asp 標記前綴,例如 <asp:Button runat=“server” />。屬于 System.Web.UI.WebControls 命名空間的ASP.NET服務器控件。

<asp:Button ID="Button2" runat="server" Text="Button"/>

當asp:button服務器按鈕通過生成的頁面后轉化成類型為submit類型的Client控件。

<input type="submit" name="Data$ctl03$button2" value="Button" onclick="return DeleteCheck(this);" id="Data_ctl03_button5" />

Web服務器控件和html服務器控件的區別

1)、Asp.net服務器控件提供更加統一的編程接口,如每個Asp.net服務器控件都有Text屬性。
2)、隱藏客戶端的不同,這樣程序員可以把更多的精力放在業務上,而不用去考慮客戶端的瀏覽器是ie還是firefox,或者是移動設備。
3)、Asp.net服務器控件可以保存狀態到ViewState里,這樣頁面在從客戶端回傳到服務器端或者從服務器端下載到客戶端的過程中都可以保存。
4)、事件處理模型不同,Html標簽和Html服務器控件的事件處理都是在客戶端的頁面上,而Asp.net服務器控件的事件處理則是在服務器上。

WEB控件,如<asp:button> 按鈕等 的 onclientclick( 客戶端 ) 先于 onclick ( 服務端 )事件執行。

總之:客戶端點擊事件先于服務器端點擊事件執行。也就是說,先執行客戶端的Javascript,然后到服務器端執行服務器的相關代碼。

四、Web用戶控件

https://www.jb51.net/article/247144.htm

五、Web自定義控件

自定義控件需要定義一個直接或間接從Control類派生的類,并重寫Render方法。在.NET框架中,System.Web.UI.Control與System.Web.UI.WebControls.WebControl兩個類是服務器控件的基類,并且定義了所有服務器控件共有的屬性、方法和事件,其中最為重要的就是包括了控制控件執行生命周期的方法和事件,以及ID等共有屬性。

1、用戶控件和自定義控件的異同

  • 使用率
    在選擇使用用戶控件和自定義控件時,可以首先考慮使用率。如果開發的應用程序只是需要小范圍的使用,則可以考慮用戶控件,而如果開發的自定義控件能夠在大部分的應用程序中被應用,則可以考慮自定義控件。
  • 創建技術
    用戶控件和自定義控件的創建技術是不相同的,并且用戶控件和自定義控件創建的難度也不相同,用戶控件是以.ascx形式聲明并創建的,開發過程也比較簡單,并且有設計器提供設計支持,而自定義控件是從System.Web.UI.Control派生而來的,開發過程稍微復雜,也沒有設計器提供設計支持。
  • 生成方式
    用戶控件和自定義控件生成的方式不同,用戶控件是以.ascx的形式呈現,而自定義控件是以DLL的形式呈現,通過添加引用,自定義控件能夠在【工具箱】中顯式,能夠像服務器控件一樣拖動到頁面,并且能夠通過編程開發增加自定義屬性。而用戶控件無法在工具箱顯示,也不能夠像自定義控件那樣增加自定義屬性。
  • 性能
    雖然用戶控件和自定義控件編寫的過程不同,也遵循不同的創建模型,但是用戶控件和自定義控件都是從System.Web.UI.Control直接或間接的派生的,在性能上沒有很大的差別,主要是因為當用戶控件在頁面中第一次使用時,將作為普通的服務器控件被解析并編譯進配件,第二次使用時,就和其他編譯型控件一樣。

實現自定義控件,必須創建一個自定義控件,自定義控件將會編譯成DLL文件。

2、實現自定義控件

自定義控件創建完成后,會自動生成一個類,并在類中生成相應的方法,示例代碼如下所示。

開發人員可以在源代碼中編寫和添加屬性。當需要呈現給HTML頁面輸出時,只需要重寫RenderContents方法即可.

為了實現服務器控件的智能屬性配置,開發人員能夠在源代碼中編寫屬性。

[DefaultProperty("Text")]                                           //聲明屬性
[ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1>")]     //設置控件格式
public class ServerControl1 : WebControl
{
    [Bindable(true)]                                                //設置是否支持綁定
    [Category("Appearance")]                                        //設置類別
    [DefaultValue("")]                                              //設置默認值
    [Localizable(true)]                                         //設置是否支持本地化操作
    public string Text                                              //定義Text屬性
    {
        get                                                 
        {
            String s = (String)ViewState["Text"];                       
            return ((s == null) ? "[" + this.ID + "]" : s);  
        }
        set                                              
        {
            ViewState["Text"] = value;
        }
    }

    //為了實現服務器控件的智能屬性配置,開發人員能夠在源代碼中編寫屬性
    public string GuoJingString //編寫屬性
    {
        get
        {
            return (String)ViewState["GuoJingString"];
        }
        set
        {
            ViewState["GuoJingString"] = value;
        }
    }

    protected override void RenderContents(HtmlTextWriter output)           //頁面呈現
    {
        output.Write("定義的Text屬性的值為:" + Text);                   //輸出為頁面呈現
    }
}

當自定義控件編寫完畢后,需要在需要使用該控件的項目中添加引用。在工具欄中會呈現自定義控件,自定義控件呈現在工具箱之后,就可以直接拖動自定義控件到頁面,并且配置相應的屬性。

用戶拖動自定義頁面到控件后,頁面會在頭部聲明自定義控件,生成相應的自定義控件的HTML代碼。

向頁面注冊了自定義控件,自定義注冊完畢后,就能夠在頁面中使用該控件。

<%@ Register TagPrefix="MyControl" Namespace="ServerControl1" Assembly="ServerControl1" %>

<form id="form1" runat="server">
    <div>
        <MyControl:ServerControl1 ID="ServerControl11" runat="server" />
    </div>
</form>

3、復合自定義控件

復合自定義控件就是功能復雜的控件。編寫復合自定義控件有以下幾種方式:

  • 創建用戶控件,并使用用戶控件封裝的用戶界面實現復合控件。
  • 開發一個編譯控件,封裝一個按鈕控件和文本框控件,通過重寫Render方法呈現。
  • 從現有的控件中派生出新控件。
  • 從基本控件類之一派生來創建自定義控件。

通過編寫復合控件,能夠讓控件開發更加靈活,控件的使用人員也能夠更加方便的配置控件,

例如,重寫登錄控件,前臺頁面制作人員使用該控件時,可以為控件配置驗證等功能,方便前臺人員配置和使用。

1、ASP.NET登錄控件的開發

public class ServerControl1 : WebControl
{
    //創建服務器控件
    public TextBox NameTextBox = new TextBox();                         //創建TextBox控件
    public TextBox PasswordTextBox = new TextBox();                     //創建密碼控件
    public Button LoginButton = new Button();                            //創建Button控件

    [Bindable(true)]
    [Category("Appearance")]
    [DefaultValue("")]
    [Localizable(true)]
    public string LoignBackGroundColor                              //設置背景屬性
    {
        get { return (String)ViewState["LoignBackGroundColor"]; }
        set { ViewState["LoignBackGroundColor"] = value; }
    }

    protected override void RenderContents(HtmlTextWriter output)           //編寫頁面輸出
    {
        output.RenderBeginTag(HtmlTextWriterTag.Div);                   //創建Div標簽
        output.RenderBeginTag(HtmlTextWriterTag.Tr);                    //創建Tr標簽
        NameTextBox.RenderControl(output);                          //添加控件
        output.RenderBeginTag(HtmlTextWriterTag.Td);                    //創建Td標簽
        output.RenderBeginTag(HtmlTextWriterTag.Br);                    //創建Br標簽
        output.RenderBeginTag(HtmlTextWriterTag.Tr);                    //創建Tr標簽
        PasswordTextBox.RenderControl(output);                      //添加控件
        output.RenderBeginTag(HtmlTextWriterTag.Td);                    //輸出Td標簽
    }

    public event EventHandler LoginClick;                                   //聲明事件

    public void Submit_Click(object sender, EventArgs e)
    {
        EventArgs arg = new EventArgs();                            //編寫按鈕事件方法
        if (LoginClick != null)                                     //判斷事件冒泡是否為空
        {
            LoginClick(LoginButton, arg);                               //觸發事件
        }
    }
}

2、ASP.NET登錄控件的使用

<%@ Page Language="C#" 
AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="_11_4._Default" %>
<%@ Register TagPrefix="Sample" TagName="Login" Src="~/LoginForm.ascx" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>無標題頁</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <Sample:Login runat="server" id="Login1"></Sample:Login>
    </div>
    </form>
</body>
</html>

4、自定義分頁控件

[DefaultProperty("Text")]                                           //默認屬性
[ToolboxData("<{0}:MyPager runat=server></{0}:MyPager>")]               //控件呈現代碼
public class MyPager : WebControl
{
    [Bindable(true)]
    [Category("Appearance")]
    [DefaultValue("")]
    [Localizable(true)]
    public string Text                                              //Text文本屬性
    {
        get
        {
            String s = (String)ViewState["Text"];
            return ((s == null) ? "[" + this.ID + "]" : s);
        }
        set
        {
            ViewState["Text"] = value;
        }
    }

    [Bindable(true)]
    [Category("Data")]
    [DefaultValue(10)]
    [Localizable(true)]
    public int PageSize                                         //分頁數屬性
    {
        get
        {
            try
            {
                Int32 s = (Int32)ViewState["PageSize"];
                return ((s.ToString() == null) ? 10 : s);
            }
            catch
            {
                return 10;
            }
        }
        set
        {
            ViewState["PageSize"] = value;
        }
    }

    [Bindable(true)]
    [Category("Data")]
    [DefaultValue("")]
    [Localizable(true)]
    public string IndexPage                                     //索引頁面
    {
        get
        {
            String s = (String)ViewState["IndexPage"];
            return ((s == null) ? ("none") : s);
        }
        set
        {
            ViewState["IndexPage"] = value;
        }
    }
    [Bindable(true)]
    [Category("Data")]
    [DefaultValue("")]
    [Localizable(true)]
    public int Rows                                      //總行數
    {
        get
        {
            int s = (int)ViewState["Rows"];
            return ((s.ToString() == null) ? 0 : s);
        }
        set
        {
            ViewState["Rows"] = value;
        }
    }

    protected override void RenderContents(HtmlTextWriter output)
    {
        string html = "";

        int pageCount = 0;                                  //分頁數
        if (Rows % PageSize > 0)                            //開始分頁
        {
            pageCount = (Rows / PageSize) + 1;              //分頁計算
        }
        else
        {
            pageCount = Rows / PageSize;
        }
        html += "<table><tr>";
        for (int i = 0; i < pageCount; i++)
        {
            if (IndexPage != i.ToString())                  //如果查看的是當前頁面,則高亮顯示
            {
                html += "<td style=\"padding:5px 5px 5px 5px;background:#f0f0f0;border:1px     dashed #ccc;\">";                       //呈現相應的HTML
            }
            else
            {
                html += "<td style=\"padding:5px 5px 5px 5px;background:Gray;border:1px dashed #ccc;\">";                       //呈現相應的HTML
            }
            html += "<a href=\"pages.aspx?page=" + i + "\">" + i + "</a>";
            html += "</td>";                            //完成HTML
        }
        html += "</tr></table>";

        output.Write(html);                             //頁面呈現
    }
}

何其他的應用程序如果需要使用分頁控件,則需要首先添加引用。

使用自定義控件并配置相應的屬性:

<%@ Register TagPrefix="MyControl" Namespace="MyPager" Assembly="MyPager" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>無標題頁</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>   
        <MyControl:MyPager ID="MyPager1" runat="server" DataBase="mytable" 
            IndexPage="1" PageName="default.aspx" PageSize="1" Pwd="Bbg0123456#" 
            Table="mynews" Uid="sa" />
    </div>
    </form>
</body>
</html>

原文鏈接:https://www.cnblogs.com/springsnow/p/9391853.html

欄目分類
最近更新