آموزش ASP.Net > راهکارهای موثر در ASP.Net
راهکار
1 - 10 : آموزش طراحی یک کنترل ساده ویزارد Wizard در ASP.Net
مقدمه :
طراحی مجموعه ای از فرم ها برای دریافت اطلاعات از کاربر ، یک نیاز اساسی در طراحی
وب سایت ها می باشد . کنترل ویزارد Wizard در ASP.Net ، با داشتن امکانات فراوان ،
امکان ایجاد مکانیزمی از فرم ها را به شما می دهد تا بتوانید در طی چندین مرحله ، اطلاعات
لازم را از کاربر دریافت کنید .
به وسیله کنترل ویزارد ، می توانید یک ویزارد چند مرحله ای ساخته ، آنها را مدیریت
نموده و به ترتیب خاص قرار دهید .
در این راهکار قصد داریم تا با استفاده از یک کنترل ویزارد ، فرمی چند مرحله ای را
طراحی نموده تا بدون نیاز به نوشتن کد خاصی ، اطلاعات مورد نظر را از کاربر دریافت
کنیم .
در این راهکار فرمی طراحی خواهیم کرد که یک نام کاربری و آدرس ایمیل را از کاربر دریافت
کرده و در مرحله نهایی ، برای تایید اطلاعات آنها را مجددا به کاربر نشان می دهد .
پس از تایید اطلاعات ، آنها را به مقصد ارسال می کنیم . کارهای تشریح شده در این راهکار
عبارتند از :
- اضافه کردن یک کنترل ویزارد Wizard به صفحه ASP.Net .
- اضافه کردن کنترل ها و متن های مورد نظر به مراحل ویزارد .
- دسترسی به اطلاعات وارد شده در مراحل مختلف ، در حین کار با کنترل ویزارد .
برای حمایت از این راهکار ، کتاب
راهکارهای موثر در ASP.Net را دانلود نمایید ...
پیش نیازها :
برای اجرای این راهکار ، بایستی نرم افزارهای زیر بر روی کامپیوتر شما نصب شده باشد
:
- مایکروسافت ویژوال استودیو یا Visual Web Developer .
مرحله اول - طراحی یک سایت ASP.Net :
در مرحله اول از راهکار بایستی یک سایت ASP.Net را برای اجرای پروژه خود ایجاد نمایید
. فرض بر این است که سایت را قبلا ایجاد کرده و یا با نحوه اجرای آن آشنایی دارید ،
در غیر اینصورت به
راهکار شماره 1-1 : نحوه ایجاد یک وب سایت ASP.Net در ویژوال استودیو بروید
.
مرحله دوم - اضافه کردن یک کنترل ویزارد به صفحه :
- در صفحه Default.aspx سایت ( که به صورت پیش فرض در آن قرار دارد ) به نمای Design
بروید .
- از بخش کنترل های Standard منوی Toolbox برنامه ، یک کنترل Wizard را درگ کرده و بر
روی صفحه قرار دهید . کنترل به صورت پیش فرض به صورت زیر است :
- کنترل ویزارد ، به صورت پیش فرض با دو مرحله آماده نمایش داده می شود . اگر بر روی
محیط مراحل کلیک نمایید ، می توانید کنترل ها و متن موجود در آنها را ویرایش نمایید
.
مرحله سوم - ویرایش مراحل ویزارد :
همانطور که گفتیم ، زمانی که کنترل ویزارد را بر روی صفحه قرار دهید ، دارای 2 مرحله
آماده به صورت پیش فرض می باشد . در این راهکار ، ما هر دو مرحله موجود در کنترل را
ویرایش کرده و یک مرحله جدید نیز برای نمایش اطلاعات وارد شده در مراحل قبل و تایید
آنها توسط کاربر ایجاد خواهیم کرد .
نحوه ویرایش مرحله اول ویزارد :
- یکی از گوشه های کنترل را کمی بکشید تا اندازه آن به 2 برابر اندازه اولیه ، تغییر
نماید .
- بر روی عبارت خط زیر دار Step 1 را در کنترل ویزارد کلیک نمایید .
- منطقه قابل ویرایش کنترل ویزارد Wizard را کلیک نمایید . اکنون شما می توانید این مرحله
از کنترل را ویرایش کنید .
- عبارت : Name را تایپ نموده و یک کنترل TextBox را از جعبه ابزار Toolbox درگ نموده
و در مقابل آن قرار دهید .
شما اکنون می توانید مرحله دوم را برای دریافت آدرس ایمیل از کاربر طراحی نمایید ،
به صورت زیر :
- بر روی منطقه قابل ویرایش کنترل کلیک نمایید .
- عبارت : Email را تایپ کرده و یک کنترل TextBox را مجددا درگ نموده و در مقابل آن قرار
دهید .
- پروژه و فایل خود را ذخیره نمایید .
اضافه کردن مرحله نهایی به کنترل ویزارد Wizard :
اکنون قصد داریم تا مرحله آخر را به کنترل اضافه نماییم . این مرحله برای تایید نهایی
اطلاعات بوده و دارای هیچ کنترل پیمایشی نیست . برای این منظور مراحل زیر را انجام
دهید :
- بر روی کنترل Wizard کلیک راست نموده و گزینه Show samrt tag را کلیک نمایید .
- در کادر محاوره ای Wizard Tasks ، گزینه Add / Remove Wizard Steps را انتخاب نمایید
.
کادر Wizard Step Collection Editor باز می شود . همانند تصویر زیر :
- از کادر انتخابی Add ، گزینه Wizard Step را کلیک نمایید . اکنون منطقه Properties
، مرحله جدید ایجاد شده را نشان می دهد .
- مقدار خاصیت Title آن را بر روی مقدار Finished تنظیم نمایید .
- سپس مقدار خاصیت StepType آن را بر روی Complete تنظیم نموده و Ok نمایید . مرحله جدید
اضافه می شود ، به صورت زیر :
اکنون شما می توانید مرحله جدید ایجاد شده خود را ویرایش نمایید . برای کامل شدن راهکار
، اکنون می خواهیم کاری کنیم تا مرحله آخر ، اطلاعاتی که کاربر در دو مرحله قبل وارد
نموده است را برای تایید به وی نشان دهد . به صورت زیر :
- بر روی کنترل ویزارد کلیک راست نموده و گزینه Show Smart Tag را انتخاب کنید .
- در پنجره Wizard Tasks ، لیست کشویی Step را برای انتخاب مرحله Finished کلیک نمایید
.
- دو کنترل Label را از منوی Toolbox درگ کرده و بر روی کنترل ویزارد قرار دهید . آنها
را با نام پیش فرضشان رها نمایید .
- فایل را ذخیره کنید . مرحله آخر به صورت زیر در می آید .
در این بخش ، کد لازم برای نمایش اطلاعات وارد شده توسط کاربر در مراحل قبل را طراحی
می کنیم . برای این منظور از رویداد Page_Load صفحه برای نمایش اطلاعات وارد شده در
مراحل قبل ، در کنترل های Label موجود در مرحله آخر استفاده می کنیم . به صورت زیر
:
- به صفحه Default.aspx برگشته و در نمای Design ، بر روی محیط صفحه دابل کلیک نمایید
.
- رویداد Page_Load صفحه ، برای نوشتن کدهای لازم در صفحه کد باز می شود . کدهای زیر
را به آن اضافه نمایید :
کد
VB
|
Private Sub Page_Load(ByVal sender As Object, _
ByVal e As System.EventArgs) _
Handles Me.Load
Label1.Text
= TextBox1.Text
Label2.Text = TextBox2.Text
End Sub
|
کد
C#
|
void Page_Load(Object sender, System.EventArgs e)
{
Label1.Text = TextBox1.Text;
Label2.Text = TextBox2.Text;
}
|
- فایل را ذخیره نمایید .
مرحله آخر - تست کردن عملیات کنترل ویزارد :
اکنون می توانیم عملکرد کنترل ویزارد را بررسی نماییم ، به صورت زیر :
- صفحه Default.aspx را در نمای Design باز نمایید .
- از منوی Wizard Tasks کنترل ، گزینه Step 1 را از کنترل کشویی Step انتخاب نمایید .
- دکمه های CTRL + F5 را برای اجرای صفحه فشار دهید . صفحه در مرورگر باز می شود .
- یک نام را در کادر متن Name ، در مرحله اول وارد نموده و دکمه Next را بزنید .
- در مرحله دوم ، یک آدرس ایمیل با فرمت صحیح را در کادر متن Email وارد نموده و دکمه
Finish را بزنید .
- اطلاعات وارد شده برای نام و ایمیل در مرحله سوم به شما نمایش داده می شود .
دانلود فایل عملی پروژه و نسخه PDF راهکار
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نطر خودتان درباره این صفحه را با ما در میان گذاشته و در صورت تمایل از Developer1
حمایت نمایید :