ユーザーコントロールの作成

2008-03-28

テキストエディタまたは HTML エディタを使用して、ユーザーコントロールを宣言して作成できます。ユーザーコントロールの宣言構文は、Web フォームページの作成時に使用される構文とよく似ています。主な違いは、ユーザーコントロールのコンテンツは、@ Page ディレクティブの代わりに @ Control ディレクティブを使用し、コンテンツの周囲には <html>、<body>、および <form> の各要素が含まれないことです。

Web フォームページの詳細とその作成方法については、「Web フォームページの概要」を参照してください。Web フォームページでユーザーコンロトールを宣言する方法については、「Web フォームページへのユーザーコントロールの取り込み」を参照してください。

ユーザーコントロールは、テキストファイル程度の簡単なものにしたり、他の ASP.NET サーバーコントロールを含んだりできます。ユーザーコントロールとそれをホストするページとの間で情報を共有する場合、そのユーザーコントロールに対してプロパティを作成できます。

アプリケーションの複数のページ上に含めることができる単純なログオンフォームを作成する手順の概要を次に示します。

ユーザーコントロールを作成するには

新しいファイルを作成し、.ascx という拡張子で名前を付けます。

たとえば、Logonform.ascx という名前のユーザーコントロールを作成したとします。
ページ最上部に @ Control ディレクティブを作成して、そのコントロールに使用するプログラミング言語を指定します (存在する場合)。

次の例は、Visual Basic .NET をプログラミング言語として使用するページに @ Control ディレクティブを指定する例を示しています。
```
<%@ Control Language="VB" %>
```
メモ Visual Studio .NET を使って Web アプリケーションを作成する場合は、アプリケーションのすべてのページとユーザーコントロールで同じプログラミング言語を使用する必要があります。
ユーザーコントロールに表示するユーザーインターフェイス要素 (コントロール) を作成します。

ユーザーコントロールとそれをホストするページとの間で情報を共有できるようにする場合は、コントロールにプロパティを作成します。

ユーザーが名前を入力するためのテキストボックスと、その名前が表示されるラベルが指定された、完全なユーザーコントロールの例を次に示します。このユーザーコントロールでは、名前をホストページで設定できるように、Name プロパティも公開されます。

<%@ Control Language="VB" %>
<script runat="server">
Public Property Name As String
   Get
       Return labelOutput.Text
   End Get
   Set
       textName.Text = Server.HtmlEncode(value)
       labelOutput.Text = Server.HtmlEncode(value)
   End Set
End Property

Public Sub buttonDisplayName_Click(sender As Object, e As EventArgs)
   labelOutput.Text = textName.Text
End Sub
</script>

<table>
    <tbody>
        <tr>
            <td>
                <b>Enter your name:</b></td>
        </tr>
        <tr>
            <td>
                <asp:TextBox id="textName" 
                    runat="server">
                </asp:TextBox>
            </td>
        </tr>
        <tr>
            <td>
                <asp:button id="buttonDisplayName" 
                   onclick="buttonDisplayName_Click" 
                   runat="server" text="Submit">
                </asp:button>
            </td>
        </tr>
        <tr>
            <td><b>Hello, 
                 <asp:Label id="labelOutput" 
                     runat="server">
                 </asp:Label>.</b>
            </td>
        </tr>
    </tbody>
</table>

[C#]
<%@ Control Language="C#" %>
<script runat="server">
    public String Name {
        get
        {
            return labelOutput.Text;
        }
        set
        {
            textName.Text = Server.HtmlEncode(value);
            labelOutput.Text = Server.HtmlEncode(value);
        }
    }

    void buttonDisplayName_Click(object sender, EventArgs e) {
       labelOutput.Text = textName.Text;
    }
</script>

<table>
    <tbody>
        <tr>
            <td>
                <b>Enter your name:</b></td>
        </tr>
        <tr>
            <td>
                <asp:TextBox id="textName" 
                    runat="server">
                </asp:TextBox>
            </td>
        </tr>
        <tr>
            <td>
                <asp:button id="buttonDisplayName" 
                   onclick="buttonDisplayName_Click" 
                   runat="server" text="Submit">
                </asp:button>
            </td>
        </tr>
        <tr>
            <td><b>Hello, 
                 <asp:Label id="labelOutput" 
                     runat="server">
                 </asp:Label>.</b>
            </td>
        </tr>
    </tbody>
</table>

ASP.NET Web ページにユーザーコントロールを追加する方法の詳細については、「Web フォームページへのユーザーコントロールの取り込み」を参照してください。

参照

Web フォームユーザーコントロール | Web フォームページへのユーザーコントロールの取り込み | Windows フォームページのサーバーイベント処理

次の方法で共有

ユーザー コントロールの作成

参照

その他のリソース

ユーザーコントロールの作成