خانه / برنامه نویسی / آموزش طراحی سایت در ASP NET قسمت اول

آموزش طراحی سایت در ASP NET قسمت اول

طراحی سایت در ASP NET قسمت اول

در این سری آموزشی بیشتر به نکات میپردازیم و تمرکز روی پروژه خاصی نداریم، بیشتر در رابطه با تکنیک های طراحی سایت در ASP NET صحبت خواهیم کرد.

طراحی سایت در ASP NET قسمت اول :

در این مقاله در رابطه با دو کنترل Label و Literal صحبت میکنیم.

همانطور که میدانید تمام کنترل های ASP.NET خواصی دارند که میتوانیم از قسمت Properties که معمولا در سمت چپ و پایین قرار دارد به آنها دسترسی داشته باشم، مانند ID و ToolTip و یا خاصیت Visible هر کنترل.

راه دیگر برای دسترسی به خواص یا پراپرتی های یک کنترل از طریق کد نویسی در سی شارپ است که میتوانیم با داشتن آی دی هر کنترل به خواص آن دسترسی داشته باشیم و آنها را تغییر دهیم.

به عنوان مثال یک Label در صفحه داریم با آی دی lbResult حالا میخواهیم خاصیت Text آن را تغییر دهیم، به راحتی با نوشتن کد زیر این ختصیت تغییر میکند :

lbResult.Text = "My Text";

بعد از اوشتن آی دی کنترل و قرار دادن نقطه بعد از آن میتوانید به تمام خواص آن کنترل دسترسی داشته باشید :

خواص کنترل در ASP.NET
خواص کنترل در ASP.NET

طراحی سایت در ASP NET قسمت اول

در استفاده از کنترل Label زمانی که کدهای ما توسط مرورگر رندر میشوند و آماده نمایش میشوند (تبدیل به کدهای HTML) میبینید که یک تگ span درست شده و متن برچسب در این تگ قرار میگیرد اما زمانی که از Literal استفاده میکنیم متن مورد نظر ما بدون هیچ تگ اضافی نمایش داده میشود.

این مورد زمانی مهم میشود که شما برای تمام المنت های صفحه استایلی را قرار میدهید ولی زمانی که صفحه را لود میکنید المنت برچسب به درستی استایل نمیگیرد!

برای آزمایش یک صفحه درست میکنیم با یک دکمه، یک Label و یک Literal.

در روال کلیک شدن دکمه کدهای زیر را مینویسیم :

ltResult.Text = "کلیک انجام شد نتیجه رندر توسط مرورگر در زیر دیده میشود.";
            lbResutl.Text = "کلیک انجام شد نتیجه رندر توسط مرورگر در زیر دیده میشود.";

که در نهایت روال کلیک شدن دکمه ما به شکل زیر خواهد بود :

protected void btnSubmit_OnClick(object sender, EventArgs e)
        {
            ltResult.Text = "کلیک انجام شد نتیجه رندر توسط مرورگر در زیر دیده میشود.";
            lbResutl.Text = "کلیک انجام شد نتیجه رندر توسط مرورگر در زیر دیده میشود.";
        }

حالا پروژه را اجرا کنید و نتیجه را ببینید، در ظاهر هر دو متن به یک صورت نمایش داده می شوند و تفاوتی بین آنها دیده نمیشود، اما وارد سورس صفحه شوید و کدهای HTML در مرورگر را ببینید! بله کنترل Literal دقیقا همان متن را نمایش میدهد اما کنترل Label علاوه بر متن یک تگ span هم دارد!

طراحی سایت در ASP NET قسمت اول

نمونه ای از این آزمایش را در لینک زیر میتوانید ببینید که یک متن را در دو کنترل Literal  و Label قرار دادیم اما خروجی HTML این دو کنترل متفاوت هستند!

کلیک کنید

آموزش طراحی سایت در ASP NET قسمت اول
آموزش طراحی سایت در ASP NET قسمت اول

 

مطلب پیشنهادی

کمپایلر زبان های برنامه نویسی

دانلود کمپایلر زبان های برنامه نویسی

کمپایلر زبان های برنامه نویسی AIDE مخفف محیط یکپارچه توسعه دهندگی اندروید می باشد. با ...

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *