آموزش ASP.Net

آموزش ASP.Net - کنترل های پایه و اولیۀ

در این فصل کنترل های اولیه و اصلی ASP.NET را معرفی کرده و دربارۀ خاصیت های آن ها توضیحاتی را خواهیم داد.

کنترل های Button

 در ASP.NET سه نوع مختلف کنترل button وجود دارد که به شرح زیر می باشد.

  • Button کنترل button متن (text) را در محدوده ی مستطیل شکل نمایش می دهد.
  • Link Button متن را به صورت لینک (hyperlink) نمایش می دهد.
  • Image Button  این کنترل یک تصویر را نمایش می دهد.

 

هنگامی که کاربر یک دکمه را کلیک می کند در حقیقت دو رخداد فعال می شوند:  Click  و .Command

سینتکس (نحوۀ نگارش) کنترل button به صورت زیر می باشد:

<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Click" / >

خواص (property) متداول کنترل نام برده در جدول زیر با ذکر شرح آن ها برای شما به نمایش گذاشته شده است:

خاصیت

شرح

Text

نوشته یا متنی که روی دکمه نمایش داده می شود را تنظیم و مقدار دهی می کند. توجه داشته باشید که این خاصیت تنها ویژه کنترل های button و link button می باشد.

ImageUrl

این خاصیت، url  که مسیر یا آدرس تصویر مورد نظر (که در کنترل image نمایش داده می شود) را فراهم می کند، گرفته یا تنظیم می کند.

این خاصیت به منظور مشخص کردن URL تصویری که باید در کنترل image نمایش داده شود بکار می رود.

AlternateText

متنی که در صورت عدم امکان نمایش تصویر توسط مرورگر نشان داده می شود را تنظیم (get یا set) می کند. این خاصیت تنها مختص کنترل image button می باشد.

CausesValidation

تعیین می کند آیا هنگامی که کاربر دکمه را کلیک کرد، صفحه اعتبار سنجی شود یا خیر (این خاصیت تعیین می کند که آیا هنگام کلیک بر روی کنترل دکمه فرمان Button و Postback شدن صفحه ، عملیات بررسی اطلاعات فرم های موجود در صفحه صورت گیرد یا خیر . پیش فرض true می باشد).

CommandName

یک مقدار رشته ای (گرفته یا تنظیم می کند) که با فشردن دکمه به رخداد command ارسال می گردد.

اسم دستور (command name) مربوط به کنترل button که به رویداد Command ارسال می گردد را گرفته یا تنظیم (get یا set) می کند.

CommandArgument

یک مقدار رشته ای که هنگام کلیک روی دکمه (توسط کاربر) به رخداد command  ارسال می شود.
)این خاصیت در واقع یک پارامتر اختیاری گرفته یا تنظیم می کند که به همراه CommandName مربوطه به رخداد Command فرستاده می شود(.

PostBackUrl

url صفحه ای که با فشردن دکمه توسط کاربر، درخواست می شود را گرفته یا تنظیم می کند.

 

کنترل textbox و label

کنترل textbox عمدتا جهت دریافت ورودی از کاربر بکار می ورد. این کنترل می تواند بسته به تنظیمات خصیصه (attribute) TextMode یک یا چند خط نوشته (متن) بپذیرد.


کنترل های label روشی آسان برای نمایش متن که قابلیت تغییر در هر بار اجرای صفحه را داشته باشد ارائه می دهد. چنانچه مایلید متنی بدون تغییر نمایش داده شود، کافی است از literal text استفاده کنید.

دستور نگارش (syntax) کنترل textbox به ترتیب زیر می باشد:

<asp:TextBox ID="txtstate" runat="server" ></asp:TextBox>

خاصیت های (property) معمول کنترل های textbox و label با ذکر شرح برای شما فهرست شده اند:

خاصیت

شرح

TextMode

این خاصیت نوع textbox را مشخص می کند.SingleLine یک textbox معمولی و استاندارد ایجاد می کند. MultiLine یک نوع textbox می سازد که قادر است چندین خط نوشته پذیرفته یا در خود جای دهد. حالت Password نیز textbox ی ایجاد می کند که کاراکترهای ورودی آن پوشش داده شده (mask) و رمزگذاری می شوند. حالت پیش فرض SingleLine است.

Text

این خاصیت محتوای متنی (text content) کنترل textbox را گرفته یا تنظیم می کند.

MaxLength

بیشترین تعداد کاراکترهایی که می توان داخل کنترل textbox وارد کرد را تعیین می کند.

Wrap

خاصیت wrap زمانی بکار می رود که می خواهید تعیین کنید آیا در یک کادر متن چند خطه، نوشته ها به صورت خودکار در خط بعدی ادامه پیدا کنند (قرار داده شوند) یا خیر. مقدار پیش فرض true می باشد.

ReadOnly

این خاصیت مشخص می کند آیا کاربر اجازه ی تغییر و اصلاح متن داخل کادر را دارد یا خیر. توجه داشته باشید که مقدار پیش فرض falseمی باشد، به این معنا که کاربر می تواند متن را اصلاح کند.

Columns

عرض کادر متن (textbox) را بر حسب تعداد کاراکتر تعیین می کند.
عرض واقعی کادر متن بر اساس فونتی (قلم نوشته) که برای ورودی (entry) متن بکار می رود، تعیین می شود.

Rows

خاصیت Rows تعداد خط هایی که کنترل textbox نمایش می دهد را تعیین می کند(در واقع ارتفاع یا طول کنترل textbox چند خطه را بر حسب تعداد خط هایی که در آن باید نمایش داده شوند مشخص می کند). مقدار پیش فرض 0 است، بدین معنا که کادر متن حاوی یک خط خواهد بود.

 

از میان خاصیت های بالا، text  بیشترین کاربرد را دارد که نشانگر متن نمایش داده شده روی label می باشد.


کنترل Checkbox و RadioButton

کنترل check box یک تک گزینه به کاربر ارائه می دهد که وی یا می تواند آن را تیک دار کند و یا تیک را از روی آن بردارد. کنترل Radio button مجموعه ای از گزینه ها را ارائه می دهد که کاربر می تواند از میان آن ها تنها یک گزینه را انتخاب کند.

به منظور ایجاد مجموعه ای از radio button ها، کافی است اسمی یکسان را برای خصیصۀ GroupName هر radio button در مجموعه تعریف کرده و بکار ببرید. چنانچه به بیش از یک گروه radio button  در فرم احتیاج است، در آن صورت می توانید اسم متفاوتی برای هر خصیصۀ GroupName  کنترل گفته شده (radio button) را انتخاب کنید.


اگر می خواهید checkbox ها و radio button ها هنگامی که فرم برای اولین بار که نمایش داده می شود، انتخاب گردند، باید خصیصه (attribute) Checked را روی true تنظیم کنید.

چنانچه خصیصۀ Checked برای چندین radio button در یک گروه true مقداردهی شده باشد، در آن صورت تنها مقدار خصیصۀ Checked کنترل radio button پایانی true در نظر گرفته می شود.

 

دستور نگارش (syntax) کنترل checkbox به صورت زیر می باشد.

<asp:CheckBox ID= "chkoption" runat= "Server"> 
</asp:CheckBox>

دستور نگارش (syntax) کنترل radio button به صورت زیر می باشد.

<asp:RadioButton ID= "rdboption" runat= "Server"> 
</asp: RadioButton>

خاصیت های معمول checkbox ها و radio button ها:

خاصیت شرح
Text نوشته یا متنی که کنار کنترل check box یا radio button نمایش داده می شود را تعیین (get یا set) می کند.
Checked مشخص می کند آیا کنترل مورد نظر انتخاب شده است یا خیر. پیش فرض false باشد.
GroupName اسم گروهی که کنترل مورد نظر متعلق به آن است را مشخص می کند.

 

کنترل های List

 ASP.NET کنترل های زیر را ارائه می دهد.

  • Drop-down list,
  • List box,
  • Radio button list,
  • Check box list,
  • Bulleted list

 

کنترل های فهرست شده به کاربر امکان می دهند یک یا چند انتخاب از آیتم های لیست داشته باشد. کنترل های List box و drop-down دربردارندۀ یک یا چند آیتم می باشند. این لیست ها را می توان یا از طریق کد و یا از طریق ویرایشگر (editor) ListItemCollection بارگذاری کرد.


دستور نگارش کنترل listbox به صورت زیر می باشد:

<asp:ListBox ID="ListBox1" runat="server" AutoPostBack="True"    OnSelectedIndexChanged="ListBox1_SelectedIndexChanged">
</asp:ListBox>

دستور نگارش کنترل drop-down list:

<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True"   OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
</asp:DropDownList>

خاصیت های متداول کنترل های drop-down و listbox به ترتیب زیر می باشد:

خاصیت

شرح

Items

مجموعه ای از اشیا Listitem که نمایشگر آیتم های داخل کنترل می باشد،برمی گرداند. این خاصیت شی از نوع ListItemCollection بازمی گرداند.

(توضیح: از این خاصیت به منظور گرفتن یا برگرداندن property های آیتم های موجود در لیست استفاده می شود).

Rows

تعداد آیتم هایی که در کادر (box) نمایش داده می شود را مشخص می کند. چنانچه لیست مورد نظر دربردارنده ی تعداد زیادی سطر است که امکان نمایش همه ی آن ها وجود ندارد، در آن صورت یک نوار پیمایش (scroll bar) اضافه می گردد.

SelectedIndex

ایندکس (شماره) آیتم انتخابی را گرفته یا تنظیم می کند. چنانچه چندین (بیش از یک) آیتم انتخاب شده باشد، در آن صورت ایندکس اولین آیتم گزنیش شده بازگردانده می شود. در صورتی که هیچ آیتمی انتخاب نشده باشد، مقدار property -1خواهد بود.

SelectedValue

مقدار آیتم جاری (انتخابی) را برمی گرداند. چنانچه بیش از یک آیتم انتخاب شده باشد، در آن صورت مقدار اولین آیتم انتخاب شده گرفته می شود. اما اگر هیچ آیتمی انتخاب نشده باشد در آن صورت مقدار این property یک رشته ی تهی (empty string) (" ") خواهد بود.

SelectionMode

مشخص می کند آیا کنترل list box اجازه ی تنها یک بار انتخاب را می دهد یا امکان چندین انتخاب از آن وجود دارد.

 

خاصیت های (property) پرکاربرد و متداول اشیا کلاس ListItem به ترتیب زیر می باشند: 

خاصیت

شرح

Text

نوشته ای که برای آیتم نمایش داده می شود را تعیین می کند.

Selected

مشخص می کند آیا آیتم مورد نظر انتخاب شده یا خیر.

Value

مقدار رشته ای(string value) مربوط به آیتم مورد نظر را گرفته یا تنظیم می کند.

لازم است توجه داشته باشید که:

  • جهت کار با آیتم های موجود در یک list box یا drop-down list، باید property آیتم های کنترل مربوط را بکار ببرید. خاصیت (property) نام برده یک شی ListItemCollection برمی گرداند که دربرگیرندۀ تمامی آیتم های لیست است.
  • هنگامی که کاربر یک آیتم دیگر (متفاوت) را از drop-down list یا list box انتخاب می کند، در آن زمان رخداد SelectedIndexChanged فعال می شود.

 

شئ  ListItemCollection


شئ ListItemCollection در واقع مجموعه ای از اشیا ListItem است. هر شی ListItem نشانگر یک آیتم در لیست می باشد. آیتم های موجود در ListItemCollection از 0 شمرده می شوند.

زمانی که آیتم ها به وسیلۀ رشته ای (string) همچون lstcolor.Items.Add("Blue") داخل list box  بارگذاری می شوند، (در آن صورت) هر دو خواص (property) Text و Value  آیتم لیست (list item)  روی آن مقداری (string value) تنظیم می شوند که شما مشخص و تعریف می کنید. جهت تغییر و اصلاح مقدار (تخصیص مقداری دیگر)، لازم است ابتدا یک شئ list item ایجاد کرده سپس آن آیتم را به مجموعه (collection) مورد نظر اضافه کنید.


ویرایشگر (Editor) ListItemCollection به منظور افزودن یک آیتم جدید به list box یا drop-down list بکار می رود. این روش در اصل برای ایجاد یک لیست ایستا یا استاتیک (static list) مورد استفاده قرار می گیرد. جهت کار با collection editor کافی است آیتم edit را از منو smart tag انتخاب کنید. روش دیگر این است که کنترل را انتخاب کرده و دکمه ی ellipsis را از Item Property (موجود در پنجرۀ properties ) کلیک کنید.

خاصیت های (property) پرکاربرد و متداول ListItemCollection:

خاصیت

شرح

Item(integer)

به وسیله ی این خاصیت می توان شماره یا ایندکس شی ListItem رابرگرداند.

یک شی ListItem برمی گرداند که نشانگر آیتم مورد نظر در شماره ی مکان قرار گیری (اندیس) مشخص شده می باشد.

Count

از این خاصیت به منظور مشخص کردن تعداد اشیا ListItem موجود در ListItemCollection استفاده کنید.

 

متدهای پرکاربرد و متداول ListItemCollection:

خاصیت

شرح

Add(string)

یک آیتم جدید به انتهای collection افزوده و پارامتر رشته ای (string parameter) را به خاصیت Text آیتم مربوطه اختصاص می دهد.

Add(ListItem)

یک آیتم جدید به انتهای collection اضافه می کند.

Insert(integer, string)

این متد آیتم مورد نظر را در شماره ی مکان قرار گیری (index location) مشخص شده درج کرده و پارامتر رشته ای (string parameter) به خاصیت text آیتم مورد نظر تخصیص می دهد.

Insert(integer, ListItem)

این متد آیتم مورد نظر را در شماره ی مکان قرار گیری (index location) مشخص شده درج می کند.

Remove(string)

تابع remove آیتمی که مقدار متنی (text value) آن با رشته ی مورد نظر یکسان است را پاک می کند.

ListItem ای که نمایشگر رشته ی مشخص شده است را از مجموعه حذف می کند.

Remove(ListItem)

این تابع آیتم مشخص شده را حذف می کند.

RemoveAt(integer)

آیتمی که دارای ایندکس مشخص شده است را از ListItemCollection پاک می کند.

Clear

کلیه ی آیتم ها را حذف می کند

FindByValue(string)

آیتمی را برمی گرداند که مقدارش با رشته ی مورد نظر یکسان باشد.

در collection به دنبال ListItem ای می گردد که خاصیت Value آن دربردارنده ی مقدار مشخص شده باشد.

FindByValue(Text)

آیتمی را برمی گرداند که متن آن با رشته (string) مورد نظر یکسان باشد.
در collection به دنبال ListItem ای می گردد که خاصیت Text آن با متن (text) مشخص شده یکسان باشد.

 

کنترل Radio Button list و کنترل Check Box list

یک radio button list فهرستی از گزینه های مانع الجمع (گزینه هایی که نمی توانند همزمان و در کنار هم هر دو صحیح بوده یا انتخاب شوند) ارائه می دهد. check box list شامل لیستی از اشیا (کلاس( ListItem  است که می توان به آن ها از طریق Items property کنترل مربوطه اشاره کرد (ارجاع داد).

دستور نگارش پایۀ  radio button list به صورت زیر می باشد:

<asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="True" 
   OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged">
</asp:RadioButtonList>

دستور نگارش پایۀ کنترل check box list:

<asp:CheckBoxList ID="CheckBoxList1" runat="server" AutoPostBack="True" 
   OnSelectedIndexChanged="CheckBoxList1_SelectedIndexChanged">
</asp:CheckBoxList>

خواص متداول کنترل های check box list و radio button list با ذکر شرح در جدول زیر ارائه گردیده است:

خاصیت

شرح

RepeatLayout

مقداری را گرفته یا تنظیم می کند که این مقدار مشخص می کند list مورد نظر با استفاده از کدام المان table)، ul، ol و یا عنصر span) اجرا شده و نمایش داده (render) شود. پیش فرض table می باشد.

RepeatDirection

مقداری را تنظیم می کند که این مقدار جهت یا حالت نمایش (نمای افقی / عمودی) کنترل radio button list را مشخص می کند. دو مقدار vertical و horizontal موجود می باشند که مقدار پیش فرض vertical می باشد.

RepeatColumns

هنگامی که خاصیت RepeatLayout روی table تنظیم شده است، شما می توانید با استفاده از این خاصیت تعداد ستون هایی که آیتم ها را در کنترل RadioButtonList نمایش می دهند، تعیین کنید. تعداد ستون پیش فرض 0 می باشد.

 

Numbered list  (لیست شماره ای) و Bulleted list (لیست Bullet )

کنترل Bulleted list لیست لاین های لیست شده یا Numbered list ایجاد می کند. این کنترل ها حاوی مجموعه ای از اشیاء ListItem می باشند که می توانند از طریق ویژگی های Items کنترل استفاده شوند.

دستور نگارش پایۀ  Bulleted list به صورت زیر می باشد:

<asp:BulletedList ID="BulletedList1" runat="server">
</asp:BulletedList>

خواص متداول کنترل های Bulleted list با ذکر شرح در جدول زیر ارائه گردیده است:

خاصیت

شرح

BulletStyle

این ویژگی سبک و ظاهر Bullet ها یا اعداد را مشخص می کند.

RepeatDirection

این مسیر کنترل های تکرار شده را مشخص می کند. مقادیر موجود افقی و عمودی هستند که پیش فرض آن عمودی می باشد.

RepeatColumns

 تعداد ستون هایی را که به هنگام تکرار کنترل ها استفاده می شوند را مشخص می کند.

 

کنترل hyperlink

کنترل HyperLink بسیار مشابه تگ<a>  در HTML می باشد.

دستور نگارش (syntax) کنترل hyperlink به صورت زیر می باشد:

<asp:HyperLink ID="HyperLink1" runat="server">
   HyperLink
</asp:HyperLink>

کنترل گفته شده دارای خاصیت های زیر می باشد:

خاصیت

شرح

ImageUrl

مسیر یا url تصویری که قرار است به عنوان لینک (بجای متن) توسط کنترل hyperlink نمایش داده شود را تعیین می کند.

NavigateUrl

URL ای که باید کاربر با کلیک روی کنترل hyperlink به آن لینک (متصل و ارجاع داده) شود را مشخص می کند.

 

Text

نوشته ای که قرار است به صورت لینک (برای کنترل hyperlink) نمایش داده شود را تعیین می کند.

Target

پنجره یا فریمی که صفحۀ لینک شده (با کلیک کاربر روی کنترل hyperlink  ) باید در آن نمایش داده شود را تعیین می کند.

 

 

کنترل image

این کنترل به منظور نمایش تصویر بر روی صفحۀ وب و در صورت عدم وجود تصویر، برای نمایش دادن یک نوشتۀ جایگزین بکار می رود. دستور نگارش کنترل image:

<asp:Image ID="Image1" runat="server">

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

خاصیت

شرح

AlternateText

این خاصیت یک متن جایگزین در صورت عدم وجود تصویر مورد نظر نمایش می دهد.

ImageAlign

به وسیله ی این خاصیت می توان ترازبندی کنترل Image را نسبت به دیگر المان های موجود در صفحۀ وب تنظیم کرد / تصویر را نسبت به دیگر عناصر صفحه ی وب تراز بندی کرد.

ImageUrl

url تصویری که قرار است توسط کنترل Image نمایش داده شود را گرفته و تنظیم می کند.

در صورتی که سوال و یا نظری دارید، از بخش نظرات با ما در میان بگذارید.

خبـرنــامه

Newsletters

در خبــرنـامه سافت اسکیل عضو شویــد تا جدیدترین هـای سایت را بلافاصله در ایمیل خـود دریافت کنیـد

شما چه نظر و یا سوالی درباره این نوشته دارید؟

مبحث آموزشی

آموزش ASP.Net

Learn ASP.Net

سرفصل ها

پرســیدن سؤال جدید

سؤال های تخصصی خود را از ما بپرسید

دنبال کردن تلگرام کانال سافت اسکیل

https://telegram.me/softskill_ir

عملیات کاربران

خبـرنــامه

Newsletters

در خبــرنـامه سافت اسکیل عضو شویــد تا جدیدترین هـای سایت را بلافاصله در ایمیل خـود دریافت کنیـد

کلیک کنید و سوالات خود را از ما بپرسید
لطفا فرم سوال را پر کنید

سوال شما با موفقیت ثبت شد. برای اینکه بتوانیم به شما اطلاع رسانی کنیم، موارد زیر را وارد کنید:

لطفا چند لحظه منتظر بمانید ...