آموزش ASP.Net > کنترل های استاندارد > کنترل ویزارد Wizard
راهکار 2 - 10 : طراحی یک ویزارد کامل با استفاده از کنترل Wizard

Skip Navigation Links.

مقدمه :

همانطور که در راهکار قبلی ، راهکار آموزش استفاده از کنترل ویزارد Wizard در ASP.Net شرح دادیم ، می توانید از این کنترل برای طراحی فرم های ویزارد مانند جهت دریافت اطلاعات از کاربران استفاده نمایید .
در این راهکار ، ویزاردی را طراحی می کنیم که اطلاعات آدرس را از کاربر دریافت کرده و در مرحله بعدی از وی سوال می کند آیا می خواهد ایمیل های آپدیت را دریافت کند یا خیر . کاربر بر حسب نیاز و علاقه خود به این سوال پاسخ داده و در نهایت ، در مرحله آخر ، کل اطلاعات وارد شده به وی نمایش داده می شود .
کارهای انجام شده در این راهکار عبارتند از :

  • ویرایش ظاهر و نمایه مراحل ویزارد .
  • اضافه کردن یک مرحله دلخواه به کنترل ویزارد Wizard .
  • کار کردن با رویدادهای کنترل ویزارد به صورت برنامه ریزی شده .
  • انتخاب نحوه نمایش یک مرحله از ویزارد بر حسب انتخاب کاربر در مرحله قبل .
  • نمایش اطلاعات وارد شده توسط کاربر به وی در مرحله آخر ویزارد .

برای حمایت از این پروژه ، کتاب راهکارهای موثر در ASP.Net را دانلود نمایید ...

پیش نیازها :

برای اجرای این راهکار نیاز دارید تا برنامه های زیر بر روی سایت شما نصب شده باشد :

  1. Microsoft Visual Studio .
  2. Microsoft .NET Framework .

مرحله اول - طراحی یک سایت ASP.Net :

در مرحله اول از راهکار بایستی یک سایت ASP.Net را برای اجرای پروژه خود ایجاد نمایید . فرض بر این است که سایت را قبلا ایجاد کرده و یا با نحوه اجرای آن آشنایی دارید ، در غیر اینصورت به راهکار شماره 1-1 : نحوه ایجاد یک وب سایت ASP.Net در ویژوال استودیو بروید .

مرحله دوم - اضافه کردن کنترل ویزارد به صفحه :

  1. در صفحه Default.aspx سایت ، به نمای Design بروید .
  2. از بخش Standard منوی Toolbox ، یک کنترل Wizard را بر روی صفحه قرار دهید .
  3. شکل اولیه کنترل به صورت زیر خواهد بود :

مرحله سوم - دریافت اطلاعات نام و آدرس از کاربر :

در مرحله بعدی به طراحی مراحل یا Step هایی در کنترل ویزارد خواهیم پرداخت که اطلاعات نام و آدرس ایمیل را از کاربر دریافت می کند .
نحوه دریافت اطلاعات از کاربر در Step 1 :

  1. یکی از گوشه های کنترل Wizard را کمی درگ کنید تا اندازه کنترل به میزان 2 برابر افزایش یافته و فضای مناسب برای کار فراهم شود .
  2. در کنترل Wizard ، بر روی گزینه Step 1 کلیک نموده و سپس در محیط کاری Step 1 کلیک نمایید تا بتوانید آن را ویرایش نمایید .
  3. عبارت Name را تایپ نموده و یک کنترل کادر متن TextBox را در مقابل آن قرار دهید .
  4. در منوی Properties ، مقدار خاصیت ID کنترل TextBox را به Name تعییر دهید .
  5. مراحل 3 و 4 را برای اضافه کردن کنترل هایی با عنوان های تعیین شده انجام دهید ( ID کنترل ها را هم معادل نام عنوان ها ست نمایید ) :
    • Address
    • City
    • PostalCode
  6. فایل را ذخیره نمایید .

اضافه کردن گزینه ای جهت دریافت ایمیل :

در این بخش از راهکار می خواهیم امکانی را در اختیار کاربر قرار دهیم تا در صورت تمایل گزینه ای را برای دریافت ایمیل های آپدیت انتخاب نماید . همچنین وی می تواند از انجام این کار صرف نظر کند . به صورت زیر :

  1. در کنترل ویزارد ، بر روی لینک مرحله دوم Step 2 کلیک نمایید .
  2. در ناحیه قایل ویرایش مرحله دوم Step 2 ، عبارت Would you like to receive e-mail updates? را تایپ نمایید .
  3. برای سوال فوق جواب های لازم را نیز طراحی کنید . بنابراین یک گزینه Yes و یک گزینه No تایپ کرده و در مقابل هر کدام از آنها یک کنترل RadioButton قرار دهید .

مرحله پنجم - اضافه کردن یک مرحله دلخواه جهت دریافت آدرس Email :

در این مرحله از راهکار ، یک Step دلخواه را برای دریافت آدرس ایمیل از کاربر ایجاد خواهیم کرد . در مراحل بعدی ، کدی را به کنترل خواهیم کرد که در صورت عدم انتخاب گزینه دریافت ایمیل های آپدیت از سوی کاربر ، این مرحله نادیده گرفته خواهد شد .
برای اضافه کردن این مرحله دلخواه ، کارهای زیر را انجام دهید :

  1. بر روی ناحیه ای خارج از ناحیه ویرایش کنترل Wizard ، کلیک راست نموده و گزینه Show Smart Tag را انتخاب نمایید .
  2. در پنجره Wizard Tasks ، گزینه Add/Remove Wuzard Steps را کلیک نموده تا پنجره Wizard Collection Editor ، مطابق تصویر زیر باز شود :
  3. در لیست کشویی Add ، گزینه Wizard Step را زده و سپس Ok نمایید . کنترل Wizard ، مرحله جدید ایجاد شده را نمایش می دهد .
  4. مرحله جدید را کلیک نمایید تا به حالت ویرایش ( edit ) برود . در منطقه قابل ویرایش Step ، عبارت Email Address را تایپ نمایید .
  5. از منوی Tooolbox و بخش کنترل های استاندارد ، یک کنترل کادر متن TextBox را در مقابل عبارت تایپ شده قرار داده و ID آن را به EmailAddress تغییر دهید .

مرحله ششم - اضافه کردن مرحله ( Step ) نهایی به کنترل ویزارد Wizard :

در این مرحله از راهکار ، Step را به کنترل ویزارد استفاده می کنیم که اطلاعاتی که کاربر در مراحل قبل وارد نموده را به وی نمایش می دهد . برای این منظور مراحل زیر را انجام دهید :

  1. بر روی کنترل Wizard کلیک راست نموده و گزینه Show Smart Tag را انتخاب نمایید .
  2. در منوی Wizard Tasks ، گزینه Add/Remove Wizard Steps را بزنید تا پنجره Wizard Collection Editor باز شود .
  3. در لیست Add ، گزینه Wizard Step را بزنید . ناحیه Properties ، خواص مرحله ( Step ) جدید را نمایش می دهد .
  4. در پنجره Properties ، مقدار خاصیت StepType را به Compelete تغییر دهید . این کار باعث می شود تا این مرحله ، مرحله پایانی باشد .
  5. بر روی دکمه Ok کلیک نمایید تا Step جدید به ویزارد اضافه شود .
    بر روی محیط ویرایش Step جدید کلیم نمایید تا قابل ویرایش شود .
  6. از بخش کنترل های استاندارد منوی Toolbox ، یک کنترل Label را بر روی صفحه قرار داده و سپس دکمه Enter را بزنید تا یک خط جدید ایجاد شود :
  7. عملیات فوق را برای ایجاد کنترل های Label لازم با مشخصات زیر انجام دهید :
    • Name
    • Address
    • City
    • Region or State
    • E-mail Address
  8. فایل را ذخیره نمایید .

اما قبل از اینکه بتوانید ویزارد را اجرا نمایید ، بایستی کدی بنویسید تا مقادیر قبلی وارد شده در کنترل های متن را درون کنترل های Label مرحله پایانی قرار دهد .

اضافه کردن کد اجرایی مرحله پایانی :

در این بخش از راهکار ، مرحله پایانی ویزارد اطلاعاتی که کاربر قبلا در مراحل وارد نموده است را به وی نشان می دهد . برای اطمینان از اینکه اطلاعات درست نمایش داده شوند ، مقدار کنترل های Label را به صورت برنامه نویسی شده تنظیم می کنیم . کدهای لازم را برای این منظور در رویداد Page_Load صفحه ، به صورت زیر قرار می دهیم :

  1. در صفحه Default.aspx ، به نمای Design رفته و بر روی محیط صفحه دابل کلیک نمایید .
    صفحه کد ، در حالی که رویداد Page_Load را نشان می دهد ، باز می شود .
  2. کدهای زیر را به رویداد 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;

      }

  3. فایل را ذخیره نمایید .

امتحان کردن کارایی کنترل ویزارد Wizard :

  1. صفحه Default.aspx را در نمای Design باز کنید .
  2. منوی Wizard Tasks ، کنترل Wizard را باز نموده و مرحله Step 1 را انتخاب نمایید .
  3. کلیدهای Ctrl + F5 را برای اجرای صفحه فشار دهید .
  4. نام و اطلاعات آدرس خود را وارد نمایید . سپس دکمه Next را بزنید .
  5. گزینه دریافت ایمیل های آپدیت را علامت زده و در مرحله بعدی ، آدرس ایمیل خود را وارد نمایید . سپس دکمه Finish را بزنید .
  6. کلیه اطلاعاتی که در طی مراحل قبل وارد کرده بودید ، در مرحله پایانی به شما نمایش داده می شود .

در مرحله بعدی ، کد لازم برای نادیده گرفتن مرحله دریافت ایمیل از کاربر ، درصورتی که وی دکمه دریافت ایمیل های آپدیت را علامت بزند ، را طراحی خواهیم کرد .



راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نطر خودتان درباره این صفحه را با ما در میان گذاشته و در صورت تمایل از Developer1 حمایت نمایید :

آیا مطالب این صفحه برای شما مناسب و مفید بوده است :

نام :                 
آدرس Email :    
 
نظر شما :  
 
سوال امنیتی : پایتخت ایران ؟      
حمایت از سایت Developer1