بررسی متد TextArea رو TextAreaFor در ASP.NET MVC

بررسی متد TextArea رو TextAreaFor در ASP.NET MVC

در این پست از وبسایت پرووید در رابطه با بررسی متد TextBox و TextBoxFor در ASP.NET MVC صحبت خواهیم کرد. معماری MVC از معمول ترین و پرکاربردترین معماری های ساخت وب اپلیکیشن ها می باشد.

در این مقاله از وب سایت پرووید در رابطه با ایجاد کردن یک کنترل TextArea با استفاده از کلاس HtmlHelper صحبت خواهیم کرد. در کلاس HtmlHelper دو Extension Method برای ایجاد کردن یک Element از نوع TextArea وجود دارد. در واقع TextArea یک کنترل است که بصورت چند خطی و یا اصطلاحاً Multi-Line طراحی شده است و به منظور وارد کردن داده های متنی از آن استفاده می شود. دو Extension Method ی که از آنها صحبت شد TextArea() و TextAreaFor() نام دارند. در رابطه با Extension Method ها در آموزش کامل توسعه نرم افزار با سی شارپ به طور مفصل صحبت کرده ایم. بطور پیش فرض این دو متد یک کنترل TextArea با دو سطر و بیست ستون ایجاد خواهند کرد. به منظور استفاده کردن از متدهای TextArea() و TextAreaFor() از یک Model Class به نام Student استفاده می کنیم. کد مربوط به این Model Class در قسمت زیر نشان داده شده است.

public class Student
{
    public int StudentId { get; set; }
    [Display(Name="Name")]
    public string StudentName { get; set; }
    public string Description { get; set; }
}

بررسی متد TextArea()

متد Html.TextArea به منظور ایجاد کردن یک Element از نوع <textarea rows=”2″ cols=”20″> می باشد. علاوه بر این یک نام مناسب نیز برای این TextArea توسط این متد لحاظ خواهد شد. پس از آن می توانید Value مربوط به این TextArea و Attribute های دیگر مربوط به این TextArea را نیز تنظیم کنید. در قسمت زیر Signature مربوط به متد TextArea() را مشاهده می کنید.

MvcHtmlString Html.TextArea(string name, string value, object htmlAttributes)

علاوه بر این می توانید با رجوع کردن به MSDN مایکروسافت دیگر Overload های مربوط به متد TextArea را بررسی کنید. متد TextArea() یک متد Loosely Typed می باشد و این به این معناست که نام Property مورد نظر که قرار است این TextArea به آن Bind بشود در قالب یک String به این متد داده می شود. در واقع TextArea با دریافت کردن این String یک Property با همین نام را از Model Class مربوطه انتخاب کرده و خود را به آن Bind می کند. پس از Bind شدن TextArea به آن Property مقدار درون آن Property بصورت خودکار در این TextArea نشان داده شده و مقدار وارد شده در این TextArea بصورت خودکار در آن Property قرار خواهد گرفت. کدی که در قسمت زیر مشاهده می کنید نحوۀ ایجاد کردن یک TextArea را نشان می دهد.

@model Student

@Html.TextArea("Description", null, new { @class = "form-control" })

خروجی HTML این کد شبیه به تصویر زیر خواهد بود.

<textarea class="form-control" id="Description" name="Description" rows="2" cols="20">This is value</textarea>

همانطوری که در مثال بالا مشاهده می کنید اولین پارامتر برای متد TextArea() نام Property مورد نظر می باشد. ما از کلاس Student که بعنوان Model Class از آن استفاده می کنیم یک Property با نام Description را انتخاب کرده ایم. این موضوع باعث می شود که Attribute های Name و Id مربوط به TextArea نیز با نام همین Property تنظیم بشوند. دومین پارامتر مقداری استکه قصد داریم در این TextArea نشان بدهیم که ما در این مثال آنرا بر روی Null تنظیم کرده ایم. دلیل تنظیم کردن مقدار پارامتر دوم با مقدار Null این است که قرار است این TextArea به پروپرتی Description اصطلاحاً Bind بشود و مقدار خود را از درون آن Property بخواند. سومین پارامتر از متد TextArea() به منظور تنظیم کردن Attribute های مورد نظر می باشد.

بسته ی آموزش ویدئویی شروع به کار با ASP.NET Core و SignalR

از شما دعوت می کنیم که از بسته ی آموزش ویدئویی شروع به کار با ASP.NET Core و SignalR دیدن کنید.

در واقع این پارامتر در قالب یک Anonymous Object به متد TextArea() داده شده و نام Attribute هایی که می خواهیم تنظیم کنیم به عنوان Property های این Anonymous Object تنظیم می شوند. در رابطه با Anonymous Object ها در آموزش کامل توسعه نرم افزار با سی شارپ به طور کامل صحبت کرده ایم. دقت کنید که می بایست نام Property های مربوط به این Anonymous Object را با علامت @ آغاز کنید. علاوه بر این روش می توانید خود یک نام برای TextArea تنظیم کنید. این موضوع باعث می شود که عملیات Bind شدن TextArea به Property مورد نظر از Model Class مورد نظرتان اتفاق نیافتد. کدی که در قسمت زیر مشاهده می کنید این موضوع را نشان می دهد.

@Html.TextArea("myTextArea", "This is value", new { @class = "form-control" })  

خروجی HTML این کد شبیه به تصویر زیر خواهد بود.

<textarea class="form-control" cols="20" id="myTextArea" name="myTextArea" rows="2">This is value</textarea>

و نهایتاً ظاهر برنامه در مرورگر وب شبیه به تصویر زیر خواهد بود.

بررسی متد TextAreaFor()

متد TextAreaFor() بعنوان یک Extension Method دیگر به منظور ایجاد کردن یک TextArea مورد استفاده قرار می گیرد. تفاوت متد TextAreaFor() با متد TextArea() در این است که متد TextAreaFor() بصورت Strongly Typed عمل می کند. به عبارت دیگر Property مورد نظر از Model Class را در قالب یک Lambda Expression و نه در قالب یک String به آن تحویل می دهیم. متد TextAreaFor() باعث می شود که TextArea نهایی به Property مشخص شده توسط Lambda Expression اصطلاحاً Bind بشود و هر مقداری که در آن قرار داده باشیم بصورت خودکار در این TextArea نشان داده شده و مقدار درون این TextArea بصورت خودکار به درون آن Property منتقل می شود.

کدی که در قسمت زیر مشاهده می کنید Signature مربوط به متد TextAreaFor() را نشان می دهد.

 MvcHtmlString TextAreaFor(<Expression<Func<TModel,TValue>> expression, object htmlAttributes) 

به منظور بررسی Overload های مختلف دیگر این متد می توانید به MSDN مایکروسافت روجوع کنید. کدی که در قسمت زیر مشاهده می کنید مثالی از نحوۀ استفاده کردن از این متد را نشان می دهد.

@model Student

@Html.TextAreaFor(m => m.Description, new { @class = "form-control" })

خروجی HTML این کد شبیه به تصویر زیر خواهد بود.

<textarea class="form-control" cols="20" id="Description" name="Description" rows="2"></textarea>

بسته ی آموزش ویدئویی ساخت اولین وب اپلیکیشن با ASP.NET Core MVC

از شما دعوت می کنیم که از بسته ی آموزش ویدئویی ساخت اولین وب اپلیکیشن با ASP.NET Core MVC دیدن کنید.

همانطور که در این مثال مشاهده می کنید اولین پارامتر از متد TextAreaFor() یک Lambda Expression است که با استفاده از آن یک Property را از Model Class انتخاب کرده ایم. اگر در مورد Lambda Expression ها به دنبال آموزش رایگان هستید می توانید از آموزش ویدئویی Lambda Expression در سی شارپ استفاده کنید. در واقع TextArea ساخته شده به این پروپرتی Bind خواهد شد. در مثالی که در قسمت بالا مشاهده می کنید ما پروپرتی Description را انتخاب کرده ایم بنابراین یک TextArea که Attribute های Id و Name آن به نام این Property یعنی همان Description تنظیم شده اند ساخته خواهد شد. علاوه بر این مقدار درون این TextArea نیز از درون همین پروپرتی Description خوانده خواهد شد و هر مقداری که در این TextArea قرار بگیرد بصورت خودکار پروپرتی به Description از کلاس Student منتقل خواهد شد.

امیدواریم که این آموزش از وبسایت پرووید نیز مورد توجه تمامی دوستان عزیز قرار گرفته باشد. از شما دعوت می‌کنیم که از دیگر آموزش های ما در رابطه با فریم ورک MVC استفاده کنید. لیست کامل این آموزش ها را می توانید در پست مربوط به آموزش کامل توسعه وب اپلیکیشن با ASP.NET MVC مشاهده کنید.

مرتضی گیتی
بدون نظر

ارسال نظر

نظر
نام
ایمیل
وب سایت