Điều khiển Wizard giống với điều khiển MultiView có thể dùng để chia một Form lớn thành nhiều phần nhỏ. Tuy nhiên nó sẽ có thêm một số thuộc tính mà MultiView không hỗ trợ.
điều khiển Wizard có thể chứa nhiều điều khiển WizardStep con, nhưng chỉ 1 WirardStep được hiển thị tại 1 thời điểm.
Các thuộc tính.
• ActiveStep: cho phép bạn lấy thông tin của WizardStep đang kích hoạt
• ActiveStepIndex: cho phép bạn gán hoặc lấy về chỉ số Index của WizardStep đang kích hoạt
• CancelDestinationPageUrl: cho phộp bạn chỉ rừ địa chỉ URL được gửi tới khi người sử dụng nhấn nút Cancel
• DisplayCancelButton: Cho phép ẩn hoặc hiện Cancel Button.
• DisplaySlideBar: Cho phép ẩn hoặc hiện SlideBar(hiển thị tất cả các WizardStep)
• FinishDestinationPageUrl: cho phép bạn chỉ định địa chỉ URL được gửi tới khi người dùng nhấn nút Finish
• HeaderText: cho phép bạn chỉ định tiêu đề hiển thị trên đỉnh của điều khiển Wizard.
• WizadSteps: Cho phép bạn lấy thông tin của các điều khiển WizardStep trong điều khiển Wizard
• Điều khiển Wizard hỗ trợ các Template.
• FinishNavigationTemplate: cho phép hiển thị Navigation ở bước kết thúc
• HeaderTemplate: hiển thị thanh tiêu đề ở đầu của điều khiển Wizard
• SlideBarTemplate: Cho phép hiển thị SlideBar trong điều khiển Wizard
• StartNavigationTemplate: Cho phép hiển thị Navigation ở bước bắt đầu
• StepNavigationTemplate: cho phép hiển thị Navigation ở các bước à không phải bước bắt đầu và kết thúc.
Điều khiển Wizard hỗ trợ các phương thức:
• GetHistory(): cho phép lấy thông tin của các điều khiển Wizard mà đã truy cập.
• GetStepType(): Cho phép bạn trả về kiểu của mỗi WizardStep riêng theo chỉ số, nó có thể là các thuộc tính sau: Auto, Start, Finish hay Step
• MoveTo(): cho phép bạn di chuyển đến một WizardStep.
Điều khiển Wizard hỗ trợ các sự kiện:
• ActiveStepChanged: xảy ra khi một WizardStep trở thành Step được kích hoạt
• CancelButtonClick: xảy ra khi Cancel Button được nhấn.
• FinishButtonClick: xảy ra khi Finish Button được nhấn
• NextButtonClick: Xảy ra khi Next button được nhấn
• PreviousButtonClick: xảy ra khi Previous button được nhấn
• SlideBarButtonClick: xẩy ra khi SlideBar button được nhấn:
Một điều khiển Wizard chứa đựng một hoặc nhiều WizardStep để diễn tả các bước strong quá trình Wizard.
Các WizardStep hỗ trợ các thuộc tính:
• AllowReturn: Ngăn cản hay cho phép người sử dụng trả về bước này từ một bước khác.
• Name: tên của điều khiển WirardStep
• StepType:Cho phép bạn gán hay lấy về kiểu của WirardStep nó có thể là các giá trị sau: Auto, Finish, Start, Complete và Step.
• Title: lấy về hoặc gán tiêu đề của điều khiển WizardStep tiêu đề này được hiển thị ở Wizard Slidebar
• Wizard: cho phép bạn lấy thông tin điều khiển Wizard chứa trong WizardStep.
• Các Sự kiện trong WizardStep
• Activate: Xảy ra khi một WizardStep được kích hoạt
• DeActivate: xảy ra khi WizardStep khác được kích hoạt.
StepType là thuộc tính quan trọng nhất của Wizard, thuộc tính nào xác định WizardStep được đưa ra như thế nào, mặc định là Auto
Ví dụ:
<%@ Page Language="C#" AutoEventWireup="true"
CodeFile="WirardControl.aspx.cs" Inherits="_Default" %>
<script runat="server">
void Wizard1_FinishButtonClick(object sender, WizardNavigationEventArgs e)
{
lblbiet.Text = txt1.Text;
lblkhoahoc.Text = txt2.Text;
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Wizard </title>
<style type="text/css">
.wizard{border:solid 1px black;font:14px Verdana,width:800px;height:300px;}
.header{color:gray;font:bold 18px Verdana,}
.sideBar{background-color:#eeeeee;padding-left:10px;width:200px;
height:23px;}
.sideBar a{text-decoration:none;}
.step{padding:10px;}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Wizard ID="Wizard1" HeaderText="Wizard control"
OnFinishButtonClick="Wizard1_FinishButtonClick"
CssClass="wizard" Width="800px" HeaderStyle- CssClass="header"
SideBarButtonStyle-CssClass="sideBar" SideBarStyle-
Width="200px" SideBarButtonStyle-Width="200px" StepStyle-CssClass="step"
runat="server">
<StepStyle CssClass="step"></StepStyle>
<WizardSteps>
<asp:WizardStep ID="WizardStep1" runat="server"
title="Lời giới thiệu">
<asp:Label ID="Label1" runat="server"
Text="Chào mừng bạn đến với Diễn đàn ĐH Hoa Sen"></asp:Label>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep2" runat="server"
title="step 1">
<asp:Label ID="Label2" runat="server"
Text="Bạn biêt đến Diễn đàn Sinh Viên Hoa Sen như thế nào?"></asp:Label>
<br />
<asp:TextBox ID="txt1" runat="server"></asp:TextBox>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep3" runat="server"
StepType="Finish" title="step 2">
<asp:Label ID="Label3" runat="server"
Text="Bạn thích khoa nào nhất ở ĐH Hoa Sen"></asp:Label>
<asp:TextBox ID="txt2" runat="server"></asp:TextBox>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep4" runat="server"
StepType="Complete" title="Tổng kết">
<asp:Label ID="Label4" runat="server" Text="Bạn biết đến Diễn Đàn Sinh Viên Hoa Sen qua:"></asp:Label>
<asp:Label ID="lblbiet" runat="server"
Text=""></asp:Label><br />
<asp:Label ID="Label5" runat="server" Text="Bạn thích nhất khoa:"></asp:Label>
<asp:Label ID="lblkhoahoc" runat="server"
Text=""></asp:Label>
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
</div>
</form>
</body>
</html>
Giải thích ví dụ:
Trên ví dụ ta đưa vào 4 WizardStep, chương trình sẽ thực hiện trình tự theo các bước và kết thúc với việc nhấn nút Finish ở WizardStep3(được thiết lập thuộc tính StepType=’Finish’) thông qua hàm “Wizard1_FinishButtonClick” sau khi thực hiện hàm này nó sẽ chuyến sang và hiển thị nội dung công việc cần thực hiên thông 2 điều khiển label trên WizardStep4 và điều khiển này được thiết lập thuộc tính StepType=”Complete”.