دانلود مقاله ایجاد یک برنامه وب نمونه در دات نت

بخشی از مقاله

ايجاد يک برنامه وب نمونه در دات نت

( بخش اول )
تاکنون مقالات متعددی در رابطه با دات نت و برنامه نويسی وب بر روی سايت منتشر شده است و شايد اين سوال برای بسياری از خوانندگان مطرح شده باشد که ارتباط اين مطالب با يکديگر چيست و چگونه می توان آنان را با يکديگر مرتبط و از مطالب ارائه شده در جهت ايجاد يک برنامه وب استفاده نمود؟. در مجموعه مقالاتی که بدين منظور آماده و بر روی سايت منتشر خواهد شد ، سعی می گردد به سوالات فوق ، پاسخ داده و با استفاده از مطالب ارائه شده و تلفيق آنان با يکديگر، به صورت کاملا" عملی و هدفمند با نحوه ايجاد يک برنامه وب ، آشنا شويم .
برای استفاده مطلوب از اين مقاله ، مطالعه مقالات زير پيشنهاد می گردد :

• محموعه مقالات مبانی برنامه نويسی وب در دات نت
• ايجاد يک برنامه وب در دات نت
• رويدادها در برنامه های وب دات نت
• مجموعه مقالات فرم های وب
• مجموعه مقالات دستيابی به داده ها در دات نت

• دستيابی به داده ها در فرم های وب
• مجموعه مقالات ارتباط به منابع داده در ADO.NET
• مجموعه مقالات ذخيره وبازيابی داده توسط ADO.NET
• مجموعه مقالات امنيت برنامه های وب

• بررسی اعتبار داده ها توسط VB.NET در فرم های وب
• راهکارهای مديريت وضعيت صفحات ASP.NET
در ابتدا لازم است يک مسئله را تعريف و در ادامه مراحل لازم برای حل آن را دنبال نمائيم :
• مسئله : ايجاد يک برنامه وب در دات نت ( سيستم مقالات )
• توضيحات : در اين برنامه کاربران در ابتدا از طريق يک فرم Login تائيد و پس از تائيد آنان توسط برنامه ، امکان استفاده از پتانسيل های برنامه (مشاهده ليست مقالات و انجام ويرايش های لازم در رابطه با يک مقاله ) در اختيار آنان قرار خواهد گرفت

• مراحل حل مسئله : جدول زير فازهای متفاوت حل مسئله به همراه مراحلی که می بايست در هر فاز دنبال شود را نشان می دهد :
مراحل لازم برای تکميل فاز فاز
• مرحله اول : ايجاد و ذخيره سازی يک برنامه وب ASP.NET
• مرحله دوم : ايجاد يک فرم وب
فاز اول : آشنائی با برنامه های وب دات نت
• مرحله اول : افزودن کنترل های سرويس دهنده به فرم وب
• مرحله دوم : آناليز کدهای HTML توليد شده

• مرحله سوم : بررسی صحت واعتبار داده ها و ارائه پيام خطاء
• مرحله چهارم : افزودن اسکريپت

• مرحله پنجم : نوشتن کد لازم در فايل Code Behind فاز دوم : استفاده از کنترل ها
• مرحله اول :فعال نمودن امکان ديباگ در برنامه های وب
• مرحله دوم : تنظيم Break point

• مرحله سوم : اشکال زدائی هوشمند
• مرحله چهارم : استفاده از Debug.write فاز سوم : اشکال زدائی برنامه
• مرحله اول : مديريت وضعيت برنامه سمت سرويس گيرنده
• مرحله دوم : مديريت وضعيت برنامه سمت سرويس دهنده فاز چهارم : مديريت وضعيت برنامه

• مرحله اول : استفاده از کلاس SqlConnection
• مرحله دوم : نمايش داده در DataGrid
• مرحله سوم : Paging و مرتب سازی DataGrid

• مرحله چهارم : دستورات ويرايش ، بهنگام سازی و ... فاز پنجم : دستيابی به داده در فرم های وب
• مرحله اول : بکارگيری از طريق امکانات ويژوال استوديودات نت فاز ششم : بکارگيری برنامه وب

خلاصه و نتايج
فاز اول : آشنائی با برنامه های وب دات نت
در اين فاز با نحوه ايجاد يک برنامه وب و اضافه نمودن يک فرم وب ( صفحه Login ) ، آشنا خواهيم شد.
مرحله اول : ايجاد و ذخيره سازی يک برنامه وب ASP.NET : در اين مرحله ، يک برنامه وب خالی ( ساختار پيش فرض ) ، ايجاد می گردد . برای ايجاد يک پروژه جديد وب با نام SrcoTest1 ، مراحل زير را دنبال می نمائيم :
• اجرای برنامه ويژوال استوديو

• انتخاب File|New|Project و يا فشردن کليدهای CTRL+SHIFT+N
• انتخاب نوع پروژه Visual Basic Projects از طريق جعبه محاوره ای New Project
• انتخاب ASP.NET Web Application ،از طريق تمپليت های ارائه شده
• درج آدرس http://localhost/SrcoTest1 در فيلد Location ( نام در نظر گرفته شده برای پروژه ، اختياری است ) .
• تائيد عمليات با فشردن دکمه OK

توضيحات : در اين مرحله ، ويژوال استوديو دات نت ، يک ريشه مجازی با نام SrcoTest1 ، فايل Global.asax ، فايل Global.asax.vb ، فايل Web.Config ، فايل WebForm1.aspx.vb ، فايل Style.css و يک فرم وب پيش فرض با نام WebForm1.aspx را ايجاد می نمايد . ويژوال استوديو ، همچنين فايل های SrcoTest1.disco ، فايل SrcoTest1.vbproj و فايل SrcoTest1.vbproj.webinfo را نيز ايجاد می نمايد .

ويژوال استوديو دات نت ، يک فولدر با نام SrcoTest1 در مسير InetPub\wwwroot \ را ايجاد می نمايد . محتوی اين فولدر به صورت زير است :

مرحله دوم : ايجاد يک فرم وب : در اين مرحله ، فرم وب پيش فرض ايجاد شده در مرحله قبل را تغيير نام داده و با نام جديد ذخيره می نمائيم .
• انتخاب View|Solution Explorer و يا فشردن دکمه های CTRL+ALT+L
• کليک سمت راست بر روی فايل WebForm1.aspx و انتخاب دستور Rename ( از طريق پنجره Solution Explorer )
• تغيير نام فايل WebForm1.aspx به Login.aspx
• مشاهده محتويات صفحه با کليک بر روی HTML Tab ( در قسمت پائين صفحه )
• دايرکتيو Page @ در ابتدای صفحه پارامترهای متفاوتی را برای صفحه مشخص می نمايد ( مثلا" زبان استفاده شده برای نوشتن کد مرتبط با صفحه )

• برای ذخيره فايل Login.aspx ، دستور File|Save Login.aspx و يا File|Save Login.aspx As را انتخاب و يا کليد CTRL+S را فعال می نمائيم . با توجه به اين که قصد ايجاد فرم وب را با محتويات فارسی ( رابط کاربر فارسی ) داريم ، گزينه File|Save Login.aspx As را انتخاب و در ادامه با انتخاب گزينه Save with Encoding ، نوع Code Page را مشخص می نمائيم .

نتايج فاز اول :
• ايجاد يک پروژه جديد با نام SrcoTest1
• تغيير نام و ذخيره فرم وب پيش فرض ( WebForm1.aspx ) به Login.aspx
در بخش دوم اين مقاله به بررسی عمليات مرتبط با فاز دوم خواهيم پرداخت. در اين رابطه با نحوه استفاده ازکنترل های سرويس دهنده بر روی فرم وب آشنا خواهيم شد( بخش رابط کاربر يک برنامه وب ) .

ايجاد يک برنامه وب نمونه در دات نت ( بخش دوم )
در بخش اول اين مقاله به بررسی يک برنامه نمونه دات نت پرداخته و با نحوه ايجاد يک برنامه وب آشنا شديم . در اين بخش به بررسی عمليات مرتبط با فاز دوم پرداخته و با نحوه استفاده ازکنترل های سرويس دهنده بر روی فرم وب آشنا خواهيم شد( بخش رابط کاربر يک برنامه وب ) .
فاز دوم : استفاده از کنترل ها
• مرحله اول : افزودن کنترل های سرويس دهنده به فرم وب
• مرحله دوم : آناليز کدهای HTML ، توليد شده

• مرحله سوم : بررسی صحت و اعتبار داده ها و ارائه پيام خطاء
• مرحله چهارم : افزودن اسکريپت
• مرحله پنجم : نوشتن کد لازم در فايل Code Behind

فاز دوم : استفاده از کنترل ها
در اين فاز، از کنترل های سرويس دهنده و Validation ( به منظور بررسی صحت داده ورودی توسط کاربر) ، استفاده کرده و کدهای مورد نياز را هم در سمت سرويس گيرنده ( اسکريپت های همراه فرم وب ) و هم در سمت سرويس دهنده ( کدهای نوشته شده در صفحه Code behind مربوط به صفحه Login ) خواهيم نوشت و در نهايت تگ های HTML توليد شده را بررسی می نمائيم .
مرحله اول : افزودن کنترل های سرويس دهنده به فرم وب : در اين مرحله ، با نحوه استفاده از کنترل های سرويس دهنده ASP.NET آشنا خواهيم شد( چهار کنترل Lable ، دو کنترل TextBox ، دو کنترل Button )

• سوئيچ به حالت Design ( کليک بر روی Design Tab )
• فعال نمودن پنجره Toolbox ( انتخاب گزينه Toolbox از طريق منوی View و يا فشردن کليدهای CTRL+ALT+X )
• انتخاب کنترل Label ازطريق Web Forms tab موجود در Toolbox و استفرار آن بر روی فرم وب Login.aspx ( در وضعيت Desgin view ) .

• تنيظيم خصلت های زير برای کنترل Label استفاده شده بر روی فرم وب . ( برای مشاهده پنجره Properties مربوط به يک کنترل ، پس از انتخاب کنترل دستور View|Properties را فعال و يا از کليد F4 ، استفاده می نمائيم ) .
تنظيم خصلت های کنترل Label اول
خصلت مقدار
ID lblHeading
Text ورود به بخش مقالات سايت سخا روش

• فرم وب Login.aspx پس از استقرار اولين کنترل سرويس دهنده Label بر روی آن :
•

• افزودن يک کنترل سرويس دهنده Label ديگر بر روی فرم وب Login و تنيظيم خصلت های آن

تنظيم خصلت های کنترل Label دوم
خصلت مقدار
ID lblUserID
Text نام

• افزودن يک کنترل سرويس دهنده Label ديگر بر روی فرم وب Login و تنيظيم خصلت های آن

تنظيم خصلت های کنترل Label سوم
خصلت مقدار
ID lblPassword
Text رمز عبور

• انتخاب کنترل TextBox از طريق Web Forms tab موجود در Toolbox و استقرار آن بر روی فرم وب Login.aspx ( در مجاورت کنترل label مربوط به "نام" )


تنظيم خصلت های کنترل TextBox اول
خصلت مقدار
ID txtUserID
TabIndex 1
Width 182px

• انتخاب يک کنترل TextBox ديگر و استقرار آن بر روی فرم وب Login.aspx ( در مجاورت کنترل label مربوط به "رمزعبور" )
تنظيم خصلت های کنترل TextBox دوم
خصلت مقدار
ID txtPassword
TabIndex 2
Width 182px
TextMode Password

• انتخاب کنترل Button از طريق Web Forms tab موجود در Toolbox و استقرار آن بر روی فرم وب Login.aspx و تنظيم خصلت های آن

تنظيم خصلت های کنترل Button اول
خصلت مقدار
ID btnSignin
Text ورود به سايت
TabIndex 3

• انتخاب کنترل Button ديگر و استقرار آن بر روی فرم وب Login.aspx و تنظيم خصلت های آن
تنظيم خصلت های کنترل Button دوم
خصلت مقدار
ID btnRestore
Text انصراف
TabIndex 4
CausesValidation False

• افزودن يک کنترل سرويس دهنده Label ديگر بر روی فرم وب Login و تنيظيم خصلت های آن ( از کنترل فوق برای نمايش پيام مورد نظر در زمان بررسی صحت داده ورودی توسط کاربر، استفاده می گردد ) .
تنظيم خصلت های کنترل Label
خصلت مقدار
ID lblResult
Text خالی
Font Smaller
ForeColor Red
• فرم وب Login.aspx پس از استقرار کنترل های سرويس دهنده مورد نياز بر روی آن :

مرحله دوم : آناليز کدهای HTML ، توليد شده : در اين مرحله با نحوه تبديل کنترل های سرويس دهنده به عناصر HTML مختص قابل نمايش در مرورگر توسط ASP.NET runtime ، آشنا خواهيم شد.
• برای مشاهده محتوی صفحه ، بر روی HTML Tab کليک می نمائيم . کد زير به صورت اتوماتيک برای کنترل های سرويس دهنده استفاده شده در فرم وب Login.aspx ايجاد می گردند. خصلت runat ="server" ، نشاندهنده سمت سرويس دهنده بودن کنترل است .
HTML Code For Server Controls
<asp:Label id="lblUserID" runat="server" ... >نام</asp:Label>
<asp:Label id ="lblPassword" runat="server" ...>رمز عبور</asp:Label>
<asp:TextBox id="txtUserID" runat="server" ...></asp:TextBox>
<asp:TextBox id="txtPassword" runat="server" ...></asp:TextBox>
<asp:Button id="btnSignin" runat="server" ...></asp:Button>
<asp:Button id="btnRestore" runat="server"...></asp:Button>
<asp:Label id="lblResult" runat="server" ...></asp:Label>
•
• برای مشاهده خروجی در مرورگر ، گزينه Debug | Start را انتخاب و يا کليد F5 را فعال می نمائيم .
• برای مشاهده خروجی HTML کنترل های سرويس دهنده ، گزينه Source را از طريق منوی View در مرورگر IE انتخاب می نمائيم :
HTML Output for Server Controls in browser
<span id="lblHeading" ... > ورود به بخش مقالات سايت سخا روش</span>
<input name=txtUserID type=text id="txtUserID" ... />
<input type=submit name=btnSignin value="ورود به سايت" ... />
•
• همانگونه که مشاهده می شود ، ASP.NET runtime ، کنترل های سرويس دهنده را به عناصر HTML مختص مرورگر ،تبديل نموده است . Runtime ممکن است در صورت ضرورت از DHTML به منظور تعيين موقعيت و محل استقرار عناصر متفاوت HTML استفاده نمايد .
نتايج مراحل يک و دو فاز دوم :
• افزودن کنترل ها ی سرويس دهنده مورد نياز بر روی فرم Login.aspx ( چهار کنترل Lable ، دو کنترل TextBox ، دو کنترل Button )
• بررسی کد توليد شده در ويژوال استوديو دات نت برای کنترل ها ی سرويس دهنده که به صورت اتوماتيک ، ايجاد می گردند .
• بررسی کد توليد شده توسط ASP.NET Runtime برای کنترل های سرويس دهنده به منظور نمايش توسط مرورگر
در بخش سوم اين مقاله به بررسی ساير مراحل تعريف شده در فاز دوم ( بررسی صحت داده ،افزودن اسکريپت ، ... ) ، خواهيم پرداخت .

ايجاد يک برنامه وب نمونه در دات نت ( بخش سوم )
آنچه تاکنون گفته شده است :
• بخش اول ايجاد يک برنامه و فرم وب ( فاز اول )
• بخش دوم : استفاده از کنترل های سرويس دهنده و بررسی کد HTML توليد شده ( فاز دوم )
فاز دوم : استفاده از کنترل ها
• مرحله اول : افزودن کنترل های سرويس دهنده به فرم وب
• مرحله دوم : آناليز کدهای HTML ، توليد شده

• مرحله سوم : بررسی صحت و اعتبار داده ها و ارائه پيام خطاء
• مرحله چهارم : افزودن اسکريپت
• مرحله پنجم : نوشتن کد لازم در فايل Code Behind
در بخش دوم اين مقاله ، مراحل اول و دوم تشريح گرديد . در اين بخش به بررسی مرحله سوم ، خواهيم پرداخت .
مرحله سوم : بررسی صحت و اعتبار داده ها و ارائه پيام خطاء :در اين مرحله با نحوه استفاده از کنترل های Validation به منظور بررسی صحت داده ورودی توسط کاربر ، آشنا خواهيم شد.
• سوئيچ نمودن به Design View ( کليک بر روی Design tab )
• استفاده از کنترل RequiredFieldValidator به منظور اطمينان از صحت درج داده ورودی در کنترل txtUserID با توجه به سياست های مورد نظر و مقداردهی مناسب خصلت های آن :
- انتخاب کنترل RequiredFieldValidator ازطريق Web Forms tab موجود در Toolbox و استفرار آن بر روی فرم وب Login.aspx ( پائين کنترل txtUserID ) .

• مقداردهی مناسب خصلت های کنترل RequiredFieldValidator .
تنظيم خصلت های کنترل RequiredFieldValidator اول
خصلت مقدار
ID RequiredFieldValidator1
ControlToValidate txtUserID
Error Message نام کاربر می بايست وارد شود

• استفاده از کنترل RequiredFieldValidator به منظور اطمينان از صحت درج داده ورودی در کنترل txtPassword با توجه به سياست های مورد نظر و مقداردهی مناسب خصلت های آن :
- انتخاب کنترل RequiredFieldValidator ازطريق Web Forms tab موجود در Toolbox و استفرار آن بر روی فرم وب Login.aspx ( پائين کنترل txtPassword) .
- مقداردهی مناسب خصلت های کنترل RequiredFieldValidator .
تنظيم خصلت های کنترل RequiredFieldValidator دوم
خصلت مقدار
ID RequiredFieldValidator2
ControlToValidate txtPassword
Error Message Password is required.

• استفاده از کنترل ValidationSummary به منظور نمايش خلاصه اطلاعات بررسی صحت داده های ورودی :
- انتخاب کنترل ValidationSummary ازطريق Web Forms tab موجود در Toolbox و استفرار آن بر روی فرم وب Login.aspx ( قسمت پائين صفحه )

• مقداردهی مناسب خصلت های ValidationSummary .
تنظيم خصلت های کنترل ValidationSummary
خصلت مقدار
ID ValidationSummary1
DisplayMode BulletList

• فرم وب Login.aspx پس از استقرار کنترل های سرويس دهنده و کنترل های RequiredFieldValidator و ValidationSummary :

• برای تست صحت داده ها ، گزينه Start را از طريق منوی Debug انتخاب و يا کليد F5 را فعال می نمائيم .
تست اول : کليک بر روی دکمه "ورود به سايت " ، بدون درج نام و رمز عبور

• تست دوم : کليک بر روی دکمه " ورود به سايت " ، درج نام و بدون درج رمز عبور

• تست سوم : کليک بر روی دکمه " ورود به سايت " ، درج رمز عبور و بدون درج نام

نتايج مراحل اول ، دوم و سوم فاز دوم :
• افزودن کنترل ها ی سرويس دهنده مورد نياز بر روی فرم Login.aspx ( چهار کنترل Lable ، دو کنترل TextBox ، دو کنترل Button )
• بررسی کد توليد شده در ويژوال استوديو دات نت برای کنترل ها ی سرويس دهنده که به صورت اتوماتيک ، ايجاد می گردند .
• بررسی کد توليد شده توسط ASP.NET Runtime برای کنترل های سرويس دهنده به منظور نمايش توسط مرورگر
• بررسی صحت داده ها
در بخش چهارم اين مقاله به بررسی ساير مراحل تعريف شده در فاز دوم ( افزودن اسکريپت و نوشتن کد لازم در فايل Code Behind ) ، خواهيم پرداخت .

ايجاد يک برنامه وب نمونه در دات نت ( بخش چهارم )
آنچه تاکنون گفته شده است :
• بخش اول ايجاد يک برنامه وب و فرم وب ( فاز اول )
• بخش دوم : استفاده از کنترل های سرويس دهنده و بررسی کد HTML توليد شده ( فاز دوم )
• بخش سوم : بررسی صحت و اعتبار داده ها ( فاز سوم )