آموزش ASP.Net > کنترل های استاندارد > کنترل ویزارد Wizard
راهکار 2 - 10 : طراحی یک ویزارد کامل با استفاده از کنترل Wizard
مقدمه :
همانطور که در راهکار قبلی ، راهکار آموزش استفاده از کنترل
ویزارد Wizard در ASP.Net شرح دادیم ، می توانید از این کنترل برای طراحی فرم
های ویزارد مانند جهت دریافت اطلاعات از کاربران استفاده نمایید .
در این راهکار ، ویزاردی را طراحی می کنیم که اطلاعات آدرس را از کاربر دریافت کرده
و در مرحله بعدی از وی سوال می کند آیا می خواهد ایمیل های آپدیت را دریافت کند یا
خیر . کاربر بر حسب نیاز و علاقه خود به این سوال پاسخ داده و در نهایت ، در مرحله
آخر ، کل اطلاعات وارد شده به وی نمایش داده می شود .
کارهای انجام شده در این راهکار عبارتند از :
- ویرایش ظاهر و نمایه مراحل ویزارد .
- اضافه کردن یک مرحله دلخواه به کنترل ویزارد Wizard .
- کار کردن با رویدادهای کنترل ویزارد به صورت برنامه ریزی شده .
- انتخاب نحوه نمایش یک مرحله از ویزارد بر حسب انتخاب کاربر در مرحله قبل .
- نمایش اطلاعات وارد شده توسط کاربر به وی در مرحله آخر ویزارد .
برای حمایت از این پروژه
، کتاب راهکارهای موثر در ASP.Net را دانلود نمایید ...
پیش نیازها :
برای اجرای این راهکار نیاز دارید تا برنامه های زیر بر روی سایت شما نصب شده باشد
:
- Microsoft Visual Studio .
- Microsoft .NET Framework .
مرحله اول - طراحی یک سایت ASP.Net :
در مرحله اول از راهکار بایستی یک سایت ASP.Net را برای اجرای پروژه خود ایجاد نمایید
. فرض بر این است که سایت را قبلا ایجاد کرده و یا با نحوه اجرای آن آشنایی دارید ،
در غیر اینصورت به راهکار شماره 1-1 : نحوه ایجاد یک وب سایت ASP.Net در ویژوال استودیو
بروید .
مرحله دوم - اضافه کردن کنترل ویزارد به صفحه :
- در صفحه Default.aspx سایت ، به نمای Design بروید .
- از بخش Standard منوی Toolbox ، یک کنترل Wizard را بر روی صفحه قرار دهید .
- شکل اولیه کنترل به صورت زیر خواهد بود :
مرحله سوم - دریافت اطلاعات نام و آدرس از کاربر :
در مرحله بعدی به طراحی مراحل یا Step هایی در کنترل ویزارد خواهیم پرداخت که اطلاعات
نام و آدرس ایمیل را از کاربر دریافت می کند .
نحوه دریافت اطلاعات از کاربر در Step 1 :
- یکی از گوشه های کنترل Wizard را کمی درگ کنید تا اندازه کنترل به میزان 2 برابر افزایش
یافته و فضای مناسب برای کار فراهم شود .
- در کنترل Wizard ، بر روی گزینه Step 1 کلیک نموده و سپس در محیط کاری Step 1 کلیک
نمایید تا بتوانید آن را ویرایش نمایید .
- عبارت Name را تایپ نموده و یک کنترل
کادر متن TextBox را در مقابل آن قرار دهید .
- در منوی Properties ، مقدار خاصیت ID کنترل TextBox را به Name تعییر دهید .
- مراحل 3 و 4 را برای اضافه کردن کنترل هایی با عنوان های تعیین شده انجام دهید ( ID
کنترل ها را هم معادل نام عنوان ها ست نمایید ) :
- فایل را ذخیره نمایید .
اضافه کردن گزینه ای جهت دریافت ایمیل :
در این بخش از راهکار می خواهیم امکانی را در اختیار کاربر قرار دهیم تا در صورت تمایل
گزینه ای را برای دریافت ایمیل های آپدیت انتخاب نماید . همچنین وی می تواند از انجام
این کار صرف نظر کند . به صورت زیر :
- در کنترل ویزارد ، بر روی لینک مرحله دوم Step 2 کلیک نمایید .
- در ناحیه قایل ویرایش مرحله دوم Step 2 ، عبارت Would you like to receive e-mail updates?
را تایپ نمایید .
- برای سوال فوق جواب های لازم را نیز طراحی کنید . بنابراین یک گزینه Yes و یک گزینه
No تایپ کرده و در مقابل هر کدام از آنها یک کنترل RadioButton قرار دهید .
مرحله پنجم - اضافه کردن یک مرحله دلخواه جهت دریافت آدرس Email :
در این مرحله از راهکار ، یک Step دلخواه را برای دریافت آدرس ایمیل از کاربر ایجاد
خواهیم کرد . در مراحل بعدی ، کدی را به کنترل خواهیم کرد که در صورت عدم انتخاب گزینه
دریافت ایمیل های آپدیت از سوی کاربر ، این مرحله نادیده گرفته خواهد شد .
برای اضافه کردن این مرحله دلخواه ، کارهای زیر را انجام دهید :
- بر روی ناحیه ای خارج از ناحیه ویرایش کنترل Wizard ، کلیک راست نموده و گزینه Show
Smart Tag را انتخاب نمایید .
- در پنجره Wizard Tasks ، گزینه Add/Remove Wuzard Steps را کلیک نموده تا پنجره Wizard
Collection Editor ، مطابق تصویر زیر باز شود :
- در لیست کشویی Add ، گزینه Wizard Step را زده و سپس Ok نمایید . کنترل Wizard ، مرحله
جدید ایجاد شده را نمایش می دهد .
- مرحله جدید را کلیک نمایید تا به حالت ویرایش ( edit ) برود . در منطقه قابل ویرایش
Step ، عبارت Email Address را تایپ نمایید .
- از منوی Tooolbox و بخش کنترل های استاندارد ، یک کنترل کادر متن TextBox را در مقابل
عبارت تایپ شده قرار داده و ID آن را به EmailAddress تغییر دهید .
مرحله ششم - اضافه کردن مرحله ( Step ) نهایی به کنترل ویزارد Wizard :
در این مرحله از راهکار ، Step را به کنترل ویزارد استفاده می کنیم که اطلاعاتی که
کاربر در مراحل قبل وارد نموده را به وی نمایش می دهد . برای این منظور مراحل زیر را
انجام دهید :
- بر روی کنترل Wizard کلیک راست نموده و گزینه Show Smart Tag را انتخاب نمایید .
- در منوی Wizard Tasks ، گزینه Add/Remove Wizard Steps را بزنید تا پنجره Wizard Collection
Editor باز شود .
- در لیست Add ، گزینه Wizard Step را بزنید . ناحیه Properties ، خواص مرحله ( Step
) جدید را نمایش می دهد .
- در پنجره Properties ، مقدار خاصیت StepType را به Compelete تغییر دهید . این کار
باعث می شود تا این مرحله ، مرحله پایانی باشد .
- بر روی دکمه Ok کلیک نمایید تا Step جدید به ویزارد اضافه شود .
بر روی محیط ویرایش Step جدید کلیم نمایید تا قابل ویرایش شود .
- از بخش کنترل های استاندارد منوی Toolbox ، یک کنترل Label را بر روی صفحه قرار داده
و سپس دکمه Enter را بزنید تا یک خط جدید ایجاد شود :
- عملیات فوق را برای ایجاد کنترل های Label لازم با مشخصات زیر انجام دهید :
- Name
- Address
- City
- Region or State
- E-mail Address
- فایل را ذخیره نمایید .
اما قبل از اینکه بتوانید ویزارد را اجرا نمایید ، بایستی کدی بنویسید تا مقادیر قبلی
وارد شده در کنترل های متن را درون کنترل های Label مرحله پایانی قرار دهد .
اضافه کردن کد اجرایی مرحله پایانی :
در این بخش از راهکار ، مرحله پایانی ویزارد اطلاعاتی که کاربر قبلا در مراحل وارد
نموده است را به وی نشان می دهد . برای اطمینان از اینکه اطلاعات درست نمایش داده شوند
، مقدار کنترل های Label را به صورت برنامه نویسی شده تنظیم می کنیم . کدهای لازم را
برای این منظور در رویداد Page_Load صفحه ، به صورت زیر قرار می دهیم :
- در صفحه Default.aspx ، به نمای Design رفته و بر روی محیط صفحه دابل کلیک نمایید .
صفحه کد ، در حالی که رویداد Page_Load را نشان می دهد ، باز می شود .
- کدهای زیر را به رویداد Page_Load صفحه ، برای قرار دادن اطلاعات در کنترل های Label
مرحله پایانی اضافه نمایید :
|
VB کد
|
Private Sub Page_Load(ByVal sender As Object, _
ByVal e As System.EventArgs) Handles Me.Load
Label1.Text = Name.Text
Label2.Text = Address.Text
Label3.Text = City.Text
Label4.Text = State.Text
Label5.Text = PostalCode.Text
Label6.Text = EmailAddress.Text
End Sub
|
|
C# کد
|
void Page_Load(object sender, EventArgs e)
{
Label1.Text = Name.Text;
Label2.Text = Address.Text;
Label3.Text = City.Text;
Label4.Text = State.Text;
Label5.Text = PostalCode.Text;
Label6.Text = EmailAddress.Text;
}
|
- فایل را ذخیره نمایید .
امتحان کردن کارایی کنترل ویزارد Wizard :
- صفحه Default.aspx را در نمای Design باز کنید .
- منوی Wizard Tasks ، کنترل Wizard را باز نموده و مرحله Step 1 را انتخاب نمایید .
- کلیدهای Ctrl + F5 را برای اجرای صفحه فشار دهید .
- نام و اطلاعات آدرس خود را وارد نمایید . سپس دکمه Next را بزنید .
- گزینه دریافت ایمیل های آپدیت را علامت زده و در مرحله بعدی ، آدرس ایمیل خود را وارد
نمایید . سپس دکمه Finish را بزنید .
- کلیه اطلاعاتی که در طی مراحل قبل وارد کرده بودید ، در مرحله پایانی به شما نمایش
داده می شود .
در مرحله بعدی ، کد لازم برای نادیده گرفتن مرحله دریافت ایمیل از کاربر ، درصورتی
که وی دکمه دریافت ایمیل های آپدیت را علامت بزند ، را طراحی خواهیم کرد .
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نطر خودتان درباره این صفحه را با ما در میان گذاشته و در صورت تمایل از Developer1
حمایت نمایید :