ارسال پاسخ 
 
امتیاز موضوع:
  • 1 رأی - میانگین امتیازات: 1
  • 1
  • 2
  • 3
  • 4
  • 5
آموزش تصویری ASP.Net 2010 قسمت 2
07-27-2011, 10:07 PM (آخرین ویرایش در این ارسال: 02-23-2023 07:13 PM، توسط learninweb.)
ارسال: #1
آموزش تصویری ASP.Net 2010 قسمت 2
با سلام خدمت تمامی کاربران گرامی در زیر آموزش تصویری ASP.Net 2010 را بررسی میکنیم توجه کنید که شما میتواند آموزش ASP.Net 2010 را به همراه چند بخش آموزشی دیگر که بصورت شبیه سازی شده و تعاملی درس داده شده است و رایگان نیز میباشد از لینک آموزش ASP دانلود کنید. در انتهای این آموزش تصویری نیز کل آموزش (هم متن و هم تصویری) در یک فایل PDF پیوست است.

در اين بخش مي‌خواهيم به بررسي روش ساخت يک فرم ورود اطلاعات بسازيم. بر روي دکمه New WebSite کليک کنيد.

[تصویر:  001.gif]


نام CreatePage را براي پروژه انتخاب کرده‌ايم. بر روي دکمه OK کليک کنيد.

[تصویر:  002.gif]


در ادامه مي‌خواهيم يک فرم جديد اضافه کنيم. منوي Website را باز کنيد.

[تصویر:  003.gif]


روي گزينه Add New Item کليک کنيد.

[تصویر:  004.gif]


اکنون گزينه Web Form جهت افزودن يک فرم جديد انتخاب شده است. روي دکمه Add کليک کنيد.

[تصویر:  005.gif]


اکنون فرم جديد به پروژه اضافه شده است و عبارت Author Data را تايپ کرده‌ايم. در ادامه مي‌خواهيم در خط پايين يک جدول به اين صفحه اضافه کنيم. براي حرکت به خط پايين دکمه Enter صفحه کليد را فشار دهيد.
براي درج جدول منوي Tabel را باز کنيد.


[تصویر:  006.gif]


بر روي Insert Tabel کليک کنيد.

[تصویر:  007.gif]


در قسمت Rows تعداد سطرها و در قسمت Columns تعداد ستون ها را بايد وارد نمائيم. در اين مثال مي‌خواهيم چهار سطر و دو ستون داشته باشيم. اکنون جعبه متن Rows يا رديفها فعال است عدد 4 را وارد کنيد تا 4 رديف داشته باشيم.

[تصویر:  008.gif]


در قسمت Columns عدد 2 وارد شده است پس دو ستون نيز داريم. در قسمت Layout تنظيمات مربوط به خانه‌هاي جدول را مي‌توان انجام داد. Border Color رنگ حاشيه را تعيين مي‌کند. در قسمت Background مي‌توانيم يک رنگ يا يک تصوير به عنوان پيش زمينه جدول انتخاب کنيم. بر روي دکمه OKکليک کنيد.

[تصویر:  009.gif]


همان طور که مشاهده مي‌کنيد جدول اضافه شد. اکنون مي‌خواهيم اطلاعاتي از کاربر در مورد نام و نام خانوادگي و تاريخ تولد دريافت کنيم . در ادامه خانه‌هاي ستون اول جدول را پر مي‌کنيم.
در اين مثال کاربر بايد اطلاعات خود را ستون دوم وارد کند به همين دليل نياز به کنترل TextBox داريم.
روي کنترل TextBox کليک کنيد.

[تصویر:  010.gif]

اين کنترل را Drag کرده و در محل مشخص شده با کادر قرمز Drop کنيد.( ماوس را بر روي کنترل TextBox برده و سپس دکمه چپ ماوس را فشرده نگه داشته و به محل مشخص شده با کادر قرمز برده و سپس دکمه ماوس را رها کنيد.)

[تصویر:  011.gif]


در صورتي که بخواهيد ابعاد اين کنترل را تغيير دهيد مي‌توانيد با استفاده از خصوصيات Height و Width اين کار را انجام دهيد يا اينکه به سادگي با استفاده از ماوس ابعاد آن را تغيير دهيد. مي‌خواهيم نام اين کنترل را تغيير دهيم تا هنگام برنامه نويسي آسان تر بتوانيم به آن دسترسي داشته باشيم. روي قسمت ID دابل کليک کنيد.

[تصویر:  012.gif]


عبارت fname را وارد کنيد.
در ادامه دو TextBox ديگر به همين روش اضافه مي‌کنيم و نام lname و dateofbirth را به عنوان Id آن‌ها قرار مي‌دهيم.
اکنون نياز به يک کنترل Button داريم. بر روي کنترل Button کليک کنيد.

[تصویر:  013.gif]


کنترل Button را به محل مشخص شده توسط کادر قرمز Drag کنيد.

[تصویر:  014.gif]


براي تغيير متن روي دکمه روي خصوصيت Text دکمه دابل کليک کنيد.

[تصویر:  015.gif]


عبارت Submit را وارد کنيد.
براي مشاهده خروجي برنامه بر روي دکمه start کليک کنيد.

[تصویر:  016.gif]


در اين برنامه اگر اطلاعاتي را در کنترلهاي Textbox وارد نمائيد و سپس روي دکمه Submit کليک کنيد اين اطلاعات به سرور ارسال شده و سپس يک صفحه جديد نمايش داده مي‌شود که در اين صفحه اطلاعات وارد شده در کنترل جعبه متن دوباره نمايش داده شده است. در صورتي که اگر با استفاده از HTML اين صفحه را ايجاد مي‌کرديم کنترلهاي جعبه متن همگي خالي مي‌شدند. در ادامه مي‌خواهيم براي دکمه Submit وظيفه‌اي تعيين کنيم. در صورتي که بخواهيد کد HTML ايجاد شده توسط ASP.Net را مشاهده کنيد کافي است که روي صفحه راست کليک کرده و گزينه View Source را انتخاب کنيد. بر روي دکمه Close کليک کنيد تا اين صفحه بسته شود.

[تصویر:  017.gif]


در ادامه سه کنترل Lable بر روي صفحه قرار مي‌دهيم. مي‌خواهيم هنگامي که بر روي دکمه Submit کليک شد، اطلاعات داخل TextBox ها توسط Label ها نمايش داده شوند. بر روي کنترل Label کليک کنيد.

[تصویر:  018.gif]


اين کنترل را به محل مشخص شده با کادر قرمز Drag کنيد.

[تصویر:  019.gif]


نام اين کنترل را همان طور که مشاهده مي‌کنيد برابر Fnamelbl قرار داده‌ايم. در ادامه دو کنترل Label ديگر به همين روش بر روي صفحه اضافه مي‌کنيم.
روي دکمه دابل کليک کنيد تا وارد قسمت کد مربوط به رويداد کليک دکمه شويم.

[تصویر:  020.gif]

در ادامه کد هاي مربوط به دکمه را وارد مي کنيم.

C# کد

protected void Button1_Click(object sender, System.EventArgs e)
{
Fnamelbl.Text = fname.Text;
lnamelbl.Text = lname.Text;
datelbl.Text = dateofbirth.Text;

}

VB کد

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click

Fnamelbl.Text = fname.Text
lnamelbl.Text = lname.Text
datelbl.Text = dateofbirth.Text

End Sub



[تصویر:  021.gif]


با استفاده از اين کدها مقدار هر Label با TextBox مربوط به آن مقدار دهي مي‌شود. براي مشاهده خروجي برنامه بر روي دکمه Start کليک کنيد.

[تصویر:  022.gif]


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

[تصویر:  023.gif]


عبارت Nima را تايپ کنيد.
درون جعبه متن دوم کليک کنيد.

[تصویر:  024.gif]


عبارت Alvanforush را وارد کنيد.
درون جعبه متن سوم کليک کنيد.

[تصویر:  025.gif]


عبارت 1354/8/17 را به عنوان سال تولد وارد کرده‌ايم.
بر روي دکمه Submit کليک کنيد.

[تصویر:  026.gif]


همان طور که مشاهده مي‌کنيد متن Label ها به عبارتي که داخل TextBox وارد کرديم تغيير پيدا کرد. براي اين کار با کليک بر روي دکمه Submit اطلاعات به سرويس دهنده يا سرور ارسال شده و در صفحه جديدي که اکنون مشاهده مي‌کنيد متن Labelها مقدار دهي شده است. توجه کنيد که محتواي TextBoxها نيز خالي نشده است. روي دکمه Close کليک کنيد.

[تصویر:  027.gif]


در اين قسمت مي‌خواهيم يکي از مهمترين مفاهيم Asp.Net يعني Postback را مورد بررسي قرار دهيم. همانطور که گفته شد هنگامي که شما اطلاعاتي را درون فرم وارد کرده و بر روي دکمه Submit کليک کنيد اطلاعات شما دريافت شده و به سرور منتقل شود. سرور عمليات مورد نظر را بر روي اطلاعات انجام مي‌دهد و سپس نتيجه کار به شما نشان داده خواهد شد. اصطلاحاً ارسال صفحه به سرور و بازگشت دوباره آن را Postback مي‌نامند.
چون اين خصوصيت مربوط به صفحه مي‌باشد بر روي صفحه دابل کليک کنيد تا وارد رويداد Page_Load صفحه شويم. اين رويداد هر باري که صفحه لود شود اتفاق مي‌افتد.

[تصویر:  028.gif]


حال مي‌خواهيم بگوييم اگر Postback اتفاق افتاد متن Label ها برابر با متن داخل TextBox ها باشد. عبارتif (ispostback) را تايپ کنيد.

[تصویر:  029.gif]


دکمه Enter صفحه کليد را فشار دهيد.

[تصویر:  030.gif]

در ادامه کد هايي که براي رويداد کليک دکمه وارد کرده بوديم را به داخل if رويداد لود صفحه منتقل مي کنيم.
C# کد

protected void Page_Load(object sender, System.EventArgs e)
{
if ((IsPostBack)) {
Fnamelbl.Text = fname.Text;
lnamelbl.Text = lname.Text;
datelbl.Text = dateofbirth.Text;
}
}

VB کد

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

If (IsPostBack) Then
Fnamelbl.Text = fname.Text
lnamelbl.Text = lname.Text
datelbl.Text = dateofbirth.Text
End If
End Sub



براي اجراي برنامه روي دکمه Start کليک کنيد.

[تصویر:  031.gif]


در زماني که صفحه Load مي‌شود چون از دستور if استفاده کرديم و مقدار PostBack برابر نادرست است کنترلهاي Label همان مقدار پيش فرض خود را نمايش مي‌دهند. اکنون اطلاعات را دوباره وارد کرده‌ايم. بر روي دکمه Submit کليک کنيد.

[تصویر:  032.gif]


با فشردن دکمه Submit، عمليات PostBack اتفاق مي‌افتد و صفحه دوباره Load شده و رويداد Load صفحه فراخواني مي‌شود در اين زمان کد نوشته شده اجرا مي‌شود. چون IsPostBack در اين برنامه برابر Trueيا درست است کدهاي داخل دستور If اجرا مي‌شوند. بر روي دکمه Close کليک کنيد.

[تصویر:  033.gif]


يک راه ديگر براي ارتباط بين TextBox و Label استفاده از Data Binding است. با استفاده از Data Binding شما مي‌توانيد بين دو کنترل سرور ارتباط برقرار کنيد. در ادامه اين روش را بررسي خواهيم کردد.
ما در اينجا مقدار پيش فرض Text مربوط به Label ها از طريق پنجره Properties پاک کرديم تا هنگامي که صفحه اجرا مي‌شود هيچ مقداري نداشته باشند. بر روي نماي Source کليک کنيد تا به حالت کد صفحه برويم.

[تصویر:  034.gif]


مي‌خواهيم مقدار Text هر Label را به مقدار Text کنترل TextBoxمتناظرش Bind کنيم. چون مي‌خواهيم درون کدهاي Html کدهاي کنترلي بنويسيم بايد اين کد ها درون تگ <%# %>قرار گيرند. در ادامه اين کار را انجام مي‌دهيم.
توجه کنيد که متن داخل عبارات <%# %> را با دقت وارد نمائيد چون اين متن به حروف کوچک و بزرگ حساس است. در قدم بعدي بايد اعلام کنيم که با هر بار Load شدن صفحه مقادير موجود در TextBox ها به Label متناظرش Bind شود. روي سربرگ AuthorForm.aspx.vb کليک کنيد.

[تصویر:  035.gif]


همان طور که مشاهده مي‌کنيد کد هاي قبلي را پاک کرده‌ايم. در رويداد Load صفحه کد DataBind()را تايپ کنيد.
توجه کنيد که در انتها حتما بايد پرانتز باز و بسته را وارد نمائيد و در زبان #C در انتها بايد از کاراکتر ; استفاده نمائيد

[تصویر:  036.gif]


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

[تصویر:  037.gif]


اکنون مشخصات را وارد کرده‌ايم. بر روي دکمه Submit کليک کنيد.

[تصویر:  038.gif]


توجه کنید که شما میتواند آموزش ASP.Net 2010 را به همراه چند بخش آموزشی دیگر که بصورت شبیه سازی شده و تعاملی درس داده شده است و رایگان نیز میباشد از لینک آموزش ASP دانلود کنید.

کاربر گرامي، شما اکنون در پايان اين بخش قرار داريد.

دانلود نرم افزار آموزشی
دانلود مستقیم - شبیه سازی شده - تعاملی - تصویری
مشاهده‌ی وب‌سایت کاربر یافتن تمامی ارسال‌های این کاربر
نقل قول این ارسال در یک پاسخ
ارسال پاسخ 


پرش به انجمن:


کاربرانِ درحال بازدید از این موضوع: 1 مهمان


دانلود نرم افزار آموزشی برای ویندوز
دانلود نرم افزار آموزشی برای اندروید