بررسی متد RadioButton و RadioButtonFor در ASP.NET MVC

بررسی متد RadioButton و RadioButtonFor در ASP.NET MVC

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

در این قسمت از سری آموزش ASP .NET MVC از وب سایت پرووید در رابطه با ایجاد کردن یک  RadioButton و یا همان  <“radio”intput type=> صحبت خواهیم کرد. در کلاس HtmlHelper دو Extension Method با نامهای RadioButton() و RadioButtonFor() قرار دارند که به منظور انجام اینکار مورد استفاده قرار می گیرند. در رابطه با Extension Method ها در آموزش کامل توسعه نرم افزار با سی شارپ صحبت کرده ایم. به منظور بررسی این دو متد از یک Model Class با نام Student استفاده خواهیم کرد که کد آنرا در قسمت زیر مشاهده می کنید.

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

بررسی متد RadioButton()

متد Html.RadioButton() به منظور ایجاد کردن یک RadioButton با یک نام مشخص و پروپرتی isChecked مشخص و نهایتاً HTML Attribute های مشخص مورد استفاده قرار می گیرند.

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

 MvcHtmlString RadioButton(string name, object value, bool isChecked, object htmlAttributes) 

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

Male:   @Html.RadioButton("Gender","Male")  
Female: @Html.RadioButton("Gender","Female") 

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

Male: <input checked="checked" 
        id="Gender" 
        name="Gender" 
        type="radio" 
        value="Male" />

Female: <input id="Gender" 
        name="Gender" 
        type="radio" 
        value="Female" />

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

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

همانطور که در مثال بالا مشاهده می کنید ما دو RadioButton برای یک Property با نام Gender تعریف کرده ایم. پارامتر دوم از متد RadioButton() یک مقدار استکه قرار است با انتخاب شدن آن RadioButton به سمت سرور ارسال بشود. اگر RadioButton ی که مربوط به مقدار Male می باشد در حالت انتخاب قرار گرفته باشد رشته ی Male به پروپرتی Gender از Model Class اختصاص داده خواهد شد. تصویر زیر خروجی ساخته شده در مرورگر را نشان می دهد.

بررسی متد RadioButtonFor()

متد RadioButtonFor() نیز به منظور ایجاد کردن یک <“radio”intput type=> در خروجی مورد استفاده قرار می گیرد. تفاوت این متد با متد RadioButton() در اینست که متد RadioButtonFor() بصورت Strongly Typed عمل می کند. بعبارت دیگر Property مورد نظرتان را در قالب یک Lambda Expression برای متد RadioButtonFor() تنظیم می کنید. در رابطه با Lambda Expression ها در آموزش ویدئویی Lambda Expression در سی شارپ به طور کامل صحبت کرده ایم. با استفاده از متد RadioButtonFor() پروپرتی مشخص شده از Model Class به کنترل RadioButton نهایی Bind خواهد شد بنابراین حالت Checked و یا UnChecked بودن آن RadioButton بر اساس مقدار درون آن Property تنظیم خواهد شد.

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

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

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

@model Student

@Html.RadioButtonFor(m => m.Gender,"Male")
@Html.RadioButtonFor(m => m.Gender,"Female")

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

<input checked="checked" 
        id="Gender" 
        name="Gender" 
        type="radio" 
        value="Male" />

<input id="Gender" 
        name="Gender" 
        type="radio" 
        value="Female" />

همانظور که در مثال بالا مشاهده می کنید اولین پارامتر برای متد RadioButtonFor() یک Lambda Expression است که با استفاده از آن Property مورد نظر از Model Class مربوطه را انتخاب می کنیم. ما در این مثال اقدام به ایجاد کردن دو RadioButton برای پروپرتی Gender کرده ایم. این موضوع باعث می شود که دو کنترل از نوع <“RadioButton”intput type=> که Attribute های Id و Name آنها با نام Property مورد نظر یعنی همان Gender تنظیم شده اند ساخته بشوند. دومین پارامتر از متد RadioButtonFor() یک مقدار است که در صورت انتخاب شدن RadioButton مورد نظر به سمت سرور ارسال خواهد شد.

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

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

ارسال نظر

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