ウィザードで入力を行うASP.NET アプリケーションの作成

「Wizard for ASP.NET Wijmo」のC1Wizardコントロールを使ったアプリケーションの作成

Step4 ページの作成

　最後にStep4ページを作成します。このページは、デザイン終了後非表示にしておき、Step3ページでメールアドレスが入力されると表示されるようにします。

　① C1Wizardコントロールの「ActiveIndex」プロパティを「3」に変更します。これで、ステップ「Step4」が表示されます。

　② Buttonコントロールを配置し、Textプロパティを「ダウンロードの開始」に変更します。

　③ C1Wizardコントロールのスマートタグから「デザイナを開く」をクリックし、「C1Wizardデザイナフォーム」を開きます。

　④ 左ペインのツリー表示から「Step4」をクリックし、「Visible」プロパティを「False」に変更します。これで、Webアプリケーション起動時はステップ「Step4」は表示されなくなります。

　OKボタンをクリックして「C1Wizardデザイナフォーム」を閉じます。

「C1Wizardデザイナフォーム」で「Visible」プロパティを「False」に変更する

　⑤ 最後に、C1Wizardコントロールの「ActiveIndex」プロパティを「0」に変更し、ステップ「Step1」が表示されるようにします。

　以上で、C1Wizardコントロールと4つのステップページが出来上がりです。

Step5 ページの表示・非表示切り替え処理

　メールアドレス入力用テキストボックス「TextBox3」のTextChangedイベントハンドラで、Step4ページの表示・非表示を切り替える処理を行います。

　処理は単純に、テキストボックスに入力があった場合はStep4ページを表示し、入力がない場合は非表示にするだけです。

　これは、Step4ページの「Visible」プロパティを操作します。TextBoxコントロールのTextChangedイベントはテキストが入れ替わると発生しますが、TextBoxコントロールからフォーカスが移動した時点で発生します。ダミーでOKボタンを使用しこれをクリックした時点でTextBoxコントロールからフォーカスが移り、TextChangedイベントハンドラが実行されるようにしています。

　ButtonコントロールのClickイベントハンドラを使うという手もありますが、AutoPostBackプロパティがないため、イベントハンドラの処理を反映させることができないので、TextBoxコントロールのTextChangedイベントを利用しました。

Visual Basic

Public Class _Default
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    End Sub

    Protected Sub TextBox3_TextChanged(sender As Object, e As EventArgs) Handles TextBox3.TextChanged
        If TextBox3.Text <> "" Then
            C1Wizard1.Steps(3).Visible = True
        Else
            C1Wizard1.Steps(3).Visible = False
        End If
    End Sub
End Class

C#

namespace Wizard_ASP_cs
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void TextBox3_TextChanged(object sender, EventArgs e)
        {
            if (TextBox3.Text != "")
            {
                C1Wizard1.Steps[3].Visible = true;
            }
            else
            {
                C1Wizard1.Steps[3].Visible = false;
            }

        }
    }
}

まとめ

　ウィザードを使うことで、1つのWebページ内に複数ページのコンテンツを作成できるので、ユーザーにやさしい操作性を提供するとともに、ハイパーリンクだらけのページに比べWebページの管理もしやすくなります。

　今回は、ダウンロードの手順をウィザードで作成してみましたが、ページをめくるという操作から手順書の表示や図鑑・本など、アイデア次第でいろいろな使い方ができるのではないでしょうか。