02. 何はともあれ "TRICK is wonderful!!"

トップどんと来い! ASP.NET > 02. 何はともあれ "TRICK is wonderful!!"

文字列の表示

ASP.NET において単に文字列を表示するには、何の努力も要りません。
WebMatrix で新しい ASP.NET ページを作成し、下のタブ「デザイン」が選択されていることを確認し、そこに「TRICK is wonderfull!!」と書きましょう。
その後、下のタブを「すべて」に切り替えます。
<%@ Page Language="C#" %>    ---(1)
<script runat="server"> ---(2)

// ページのコードをここに記述してください。
//

</script>
<html>
<head>
</head>
<body>
<form runat="server"> ---(3)
<p>
TRICK is wonderful!!<!-- コンテンツをここに配置してください。 -->
</p>
<p>
 
</p>
</form>
</body>
</html>
(1) ページの初期設定
ASP.NET ページの初期設定を行うコードです。ここでは、「Page Language="C#"」として、使う言語を宣言しています。

(2) コード部分
コード部分です。今はコードを書いてないので、何も書いてありません。 runat = run + at で、「サーバで動かすよ」ということを宣言しています。

(3) HTML 部分
実際に視覚的に表示される部分、HTML 部分です。ここには HTML 文法を駆使して記述しますが、ここでは段落を表す <p> 以外に利用されていません。
ここに将来的には Web コントロールを記述しますので、ここでも runat が記述されています。ちなみに Web コントロールとはボタン・テキストボックスなどです。

再生マークのような「実行」ボタンを押すことで、WebMatrixServer が自動的に起動され、表示されます。
確認した後は右下のタスクトレイにサーバのアイコンが表示されますので、これを右クリックし て「停止」します。これをしなければ「実行」ボタンを押したときにポートを変更するように注意されます。

このファイルをサーバにアップすれば、あなただけの ASP.NET サイトの第一歩を踏み出したことになります。

ボタンを押しても "TRICK is wonderful!!"

ASP.NET をやっていてい面白いのは、ただ文字列を表示させるようなことではありません。ここでは、ボタンをクリック すると、テキストボックスに "TRICK is wonderful!!" を表示させるページを作ります。

タブを「デザイン」にすると左側のツールボックスに「Web コントロール」があります。その中の[ Button ] と [ TextBox ] をドラッグアンドドロップで、デザインウィンドウへ持っていくと、あっと言うまもなくコントロールが配置されます。

[ Button1 ] をクリックすると、右下の「プロパティウィンドウ」 が切り替わりますから、そこで
Text = "Click"
すなわち、Text プロパティを見つけ出して、プロパティ値を「Click」に切り替えます。その後、[ Button1 ] をダブルクリックして、「コード」タブに自動切換えします。

これまた、あっという間に Button1_Click イベントが自動生成されていますから、この中に以下のプログラムを追加します。
TextBox1.Text = "TRICK is wonderful!!";

プログラムの内容は、入門講座を読まれた方なら寝てても簡単なほどわかりやすいものです。ただし、自動生成されたコントロールは始めは大文字であることを 確認してください。最後のセミコロン、お忘れなく。
<%@ Page Language="C#" %>
<script runat="server">

    // ページのコードをここに記述してください。
    //
    
    void Button1_Click(object sender, EventArgs e) {
        TextBox1.Text = "TRICK is wonderful!!";
    }

</script>
<html>
<head>
</head>
<body>
    <form runat="server">
        <p>
            <asp:Button id="Button1" onclick="Button1_Click" runat="server" Text="Click">
            </asp:Button>
             <asp:TextBox id="TextBox1" runat="server"></asp:TextBox>
            <!-- コンテンツをここに配置してください。 -->
        </p>
    </form>
</body>
</html>
(1) Click イベント
Win アプリで慣れていると思いますので、説明は省きます。
private と System. はそれぞれ省略されているようです。

(2) Button コントロール
<asp:~> これは Web コントロールを意味します。この中に、
の3要素と runat を混ぜて、</asp:~> で閉じます。他にも入ることもあります。

(3) TextBox コントロール
TextBox コントロールです。これにはイベントがないため、Button1 の onclick に値するものはありません。TextBox の場合は TextChanged イベントがポピュラーです。