آشنائی با فرم های وب

به عنوان يک برنامه نويس ويژوال بيسيک شما می توانيد برنامه های تحت اينترنت نيز بنويسيد. به طور معمول برنامه نويسان ويژوال بيسيک به سمت ASP که يک تکنولوژی از مايکروسافت است متمايل هستند. دليل اين امر هم شباهت ميان VB و VBScript می باشد. بزرگترين ايرادی که ASP کلاسيک دارد نداشتن يک محيط ويژوال مانند فرم های معمولی بيسيک است. مايکروسافت با Visual InterDev سعی کرد اين کمبود را جبران کند اما چندان موفق نبود. بالاخره در ويژوال بيسيک دات نت ترکيبی از InterDev و ويژوال بيسيک وجود دارد و امکانات فرم های ويژوال بيسيک را برای اينترنت نيز فراهم می کند.

Web Form ها يکی از اجزای تکنولوژی ASP.NET است که به برنامه نويس های اکثر زبان ها اين امکان را می دهد که يک قالب ويژوال با HTML و يک محيط برنامه نويسی تحت سرور با کدهای پيشرفته داشته باشند.

Web From ها در عمل

بهترين راه برای فراگيری اين تکنولوژی يک مثال عملی از آن است. پس از مثال معروف Hello World برای شروع استفاده می کنيم.

آماده سازی محيط
قبل از شروع ابتدا بايد نرم افزارهای مورد نياز را از روی ليست زير نصب کنيد. اگر ويژوال استوديو دات نت را به شکل کامل و بر روی ويندوز 2000 يا اکس پی نصب کرديد احتياج به مراحل زير نداريد.

• سيستم عامل شما بايد حتما ً از نوع ان تی باشد، ويندوز 2000 ( سرور يا Professional)، ويندوز اکس پی Professional و يا ان تی سرور 4.
• بايد.NET Framework بر روی سروری که می خواهيد با آن کار انجام دهيد يا برنامه شما بر روی آن اجرا خواهد شد نصب شده باشد. اگر ويژوال استوديو دات نت را نصب کرده ايد مشکلی در اين مرحله نداريد.
• مايکروسافت توصيه کرده که سيستم فايل هارد ديسک سرور شما بهتر است NTFS باشد، هم به دليل مسائل امنيتی و هم سرعت بيشتر.

Hello World
در فرم مخصوص ايجاد يک پروژه جديد ASP.NET Web Application را انتخاب کنيد و نام آن را HelloWorld قرار دهيد. دقت کنيد که مکان ذخيره پروژه http://localhost باشد.

سپس بر روی کليد OK کليک کنيد تا يک solution جديد ايجاد گردد. به طور قراردادی ويژوال استوديو يک Web Form با نام WebForm1.aspx ايجاد می کند. دقت کنيد که پسوند فايل چه تغييری کرده است.

وقتی بر روی کليد OK کليک می کنيد چند عمل در پشت صحنه انجام می شود. به غير از ايجاد کردن يک شاخه در دايرکتوری Visual Studio Projects، ويژوال استوديو يک web application نيز در سروری که انتخاب کرده ايد ايجاد می کند. بر روی سرور، ويژوال استوديو دات نت:

• يک دايرکتوری با نام پروژه در شاخه inetpub/wwwroot ايجاد می کند.
• اين دايرکتوری را به عنوان يک IIS Application معرفی کرده و اجازه اجرای script را بر روی آن می دهد.
• اگر FrontPage Server Extensions را نصب کرده باشيد يک FrontPage Web ايجاد می کند تا با FrontPage هم بتوانيد به آن دسترسی داشته باشيد.

می توانيد همانگونه که با فرم های معمولی ويژوال بيسيک کار می کرديد از Web Form ی که جلوی شما است استفاده کنيد، يعنی به شما امکان استفاده از toolbox و استفاده از کامپوننت های درون آن بر روی web form داده شده است. يک Label را از toolbox برداشته و بر روی قسمت بالای فرم قرار دهيد و خاصيت text آن را به Hello World تغيير دهيد.

برای اين مثال تمام کاری که لازم بود انجام شود را انجام داديم. حالا می توانيم برنامه را اجرا کنيم. قبل از اينکار از toolbar و در قسمت Solution Configuration به جای debug، release را انتخاب کنيد. حالا بوسيله کليد F5 برنامه را اجرا کنيد. اگر هيچ مشکلی در سيستم نباشد بايد صفحه مرورگر باز شود و فايل WebForm1.aspx نمايش داده وبر روی آن Hello World نوشته شود.

بر روی صفحه مرورگر کليد سمت راست موس را بزنيد و View Source را انتخاب کنيد تا ببينيد چه مطالبی در سورس اين صفحه آمده است. همانطور که می بينيد کدهايی به HTML است که بوسيله فايل aspx در زمان اجرا ايجاد شده است.

همانطور که می بينيد يک HTML Form در اين متن ديده می شود در حالی که ما چنين چيزی را اضافه نکرده بوديم، درباره اين مساله در ادامه توضيح خواهم داد. Label ی که اضافه کرده بوديم در تگ ِ span قرار دارد. تگ ِ span مانند يک container برای Label ما است و اطلاعات آن را در خود نگهداری می کند. به ويژوال استوديو دات نت باز می گرديم.

همانطور که ديديد Web Form ها خيلی شبيه فرم های معمولی ويندوز هستند. در Web From جديدی که می سازيم اين خاصيت را بيشتر امتحان می کنيم. در برنامه Hello World که ايجاد کرديم تنها يک Web Form داشتيم: WebForm1.aspx. يک Web Form ديگر می سازيم تا کارهای بيشتری با آن انجام دهيم.

منوی Project | Add Web Form را انتخاب کنيد. در فرمی که باز می شود Web Form را انتخاب کنيد و مطمئن شويد که نام آن WebForm2.aspx است. ( قبل ازاين کار ويژوال استوديو را از حالت اجرای برنامه خارج کنيد )

بر روی Open کليک کنيد تا WebForm2.aspx در solution ايجاد شود. بر روی WebForm2.aspx در Solution Explorer دو بار کليک کنيد تا مطمئن باشيد که فرمی که تازه ايجاد کرده ايد فعال است. مانند مثال قبلی يک Label بر روی فرم قرار دهيد، سپس يک Button در زير آن قرار دهيد و اندازه هر دو را يکسان کنيد. بر روی Label کليک کنيد و از پنجره Properties خاصيت ID را انتخاب کنيد و آن را به lblText تغيير دهيد. سپس بر روی کليد کليک کنيد و ID آن را به btnSubmit تغيير دهيد. بر روی کليد يک بار کليک کنيد، سپس کليد Enter را بزنيد تا به قسمت نوشتن کد برای اين کليد وارد شويد.

در ASP.NET هر کدام از کنترل ها، کدی در پشت صحنه برای خود دارند. همانطور که مشاهده می کنيد يک روال با نام btnSubmit_Click وجود دارد که هنگامی که بر روی کليد کليک می شود اجرا می شود. کدی که در اين روال نوشته شده باشد در سرور اجرا می شود و نه در مرورگر کامپيوتر کاربر. کد زير را در روال مورد بحث بنويسيد :

lblText.Text = "Hello World"

همانطور که مشاهده کرديد IntelliSense وارد عمل شده و وقتی بعد از lblText، نقطه را تايپ کرديد ليستی از خواص و متد های مربوط به Label را به شما نمايش داد. اين خاصيت در InterDev هم وجود دارد ولی در ويژوال استوديو دات نت از امکانات بيشتر و ليست پرمحتواتری برخوردار است.

پنجره کد را ببنديد و به قسمت طراحی Web Form برويد، خاصيت ِ Text ِ کليد را به Submit تغيير دهيد. حالا برنامه را امتحان می کنيم. اگر سعی کنيد تا برنامه را بوسيله کليد F5 اجرا کنيد دوباره WebForm1.aspx نمايش داده خواهد شد، زيرا که اين فرم، فرم ابتدايی در پروژه ما است. برای اينکه WebForm2.aspx به فرم ابتدايی تبديل شود در پنجره Solution Explorer بر روی WebForm2.aspx کليد سمت راست موس را بزنيد و سپس Set As Start Page را انتخاب کنيد. حالا می توانيد برنامه اجرا کنيد.

Web Form جديد، WebForm2.aspx در مرورگر اينترنت نمايش داده می شود در حالی که بر روی آن يک Label و يک کليد وجود دارد. بر روی کليد کليک کنيد تا متنی که تايپ کرده بوديد در Label نمايش داده شود. همانطور که می بينيد برنامه مانند فرم های معمولی ويندوز اجرا می شود.