نحوه ایجاد User Control سفارشی با استفاده از HtmlHelper در Asp.Net MVC Razor Engine

پنجشنبه 14 اسفند 1393

در این مقاله نحوه ایجاد یک کنترل سفارشی با استفاده از HtmlHelper در MVC5 و Razor View Engine را شرح میدهیم

نحوه ایجاد User Control سفارشی با استفاده از HtmlHelper در  Asp.Net MVC Razor Engine

در Asp.net ما User Control را با پسوند .ascx می سازیم .اما در Asp.Net MVC یک تفاوت کوچک دارد .

در MVC ما چند راه برای این کار داریم , در MVC ما Partial Viiew  , HtmlHelper و غیره داریم .

HtmlHelper در واقع یک کلاس برای ارائه نمایش کنترل های Html میباشد .

در اینجا یک مثال ساده که شامل وضعیت ورود کاربر میباشد توضیح داده شده :

برای این کار ما یک متد و یک کلاس Static ایجاد می کنیم :

public static class LoginStatusControl  
{  
  
    public static MvcHtmlString LoginStatus(this HtmlHelper htmlHelper, string CssClass)  
    {  
        StringBuilder sb = new StringBuilder();  
        sb.Append("<ol class='" + CssClass + "'>");  
        if (System.Web.HttpContext.Current.User.Identity.IsAuthenticated)  
        {  
            sb.Append("Hello ");  
            sb.Append(System.Web.HttpContext.Current.User.Identity.Name );  
            sb.Append("!");  
        }  
        else  
        {  
            sb.Append("Welcome");  
        }  
          
        sb.Append("</ol>");  
        return MvcHtmlString.Create(sb.ToString());  
    }  
}  

سپس ما کلاس Css را به کنترل مورد نظر پاس می دهیم , که در صورت احراز هویت کاربر نمایش داده میشود . به عنوان مثال "Hello Tom" نمایش داده میشود . در غیر اینصورت تنها پیغام خوش آمدید نمایش داده می شود .سپس این کنترل را در Layout خود قرار می دهیم .

<div class="row">  
    <div class="col-xs-3">  
        @Html.LoginStatus("breadcrumb")  
    </div>  
</div>  

"breadcrumb" یک کلاس Css است که ما میتوانیم هر پارامتری را مانند متد به User Control پاس دهیم .

فایل های ضمیمه

برنامه نویسان

نویسنده 3355 مقاله در برنامه نویسان

کاربرانی که از نویسنده این مقاله تشکر کرده اند

در صورتی که در رابطه با این مقاله سوالی دارید، در تاپیک های انجمن مطرح کنید