Hyperlinks

Markup

  @Html.Hyperlink("Take me to google", "http://www.google.com")
  

Output

All available extensions

  @Html.Hyperlink(linkText, url, htmlAttributes)
  @Html.Hyperlink(linkText, actionresult, htmlAttributes)    
  

Images

Markup

  @Html.Image("/Content/png/youtube-logo.png", "YouTube", "Take me to YouTube")
  

Output

All available extensions

  @Html.Image(src, htmlAttributes)
  @Html.Image(src, altText, htmlAttributes)
  @Html.Image(src, altText, title, htmlAttributes)
  

Styled images

Bootstrap supports styling of images via the following CSS classes:

.img-circle
.img-rounded
.img-polaroid

Imagelinks

An image link is basically an image embedded into a hyperlink

Markup

  @Html.Imagelink("/Content/png/youtube-logo.png", "YouTube", "Take me to YouTube", "http://www.youtube.com")
  

Output

All available extensions

  @Html.Imagelink(src, url, htmlAttributes)
  @Html.Imagelink(src, altText, url, htmlAttributes)
  @Html.Imagelink(src, altText, title, url, htmlAttributes)
  @Html.Imagelink(src, actionresult, htmlAttributes)
  @Html.Imagelink(src, altText, actionresult, htmlAttributes)
  @Html.Imagelink(src, altText, title, actionresult, htmlAttributes)
  

Notes

  // Any attributes specified with property name 'a' will be applied to the link
  // and those specified with property name 'img' will be applied to the image
  new { a = new { attr1 = value1 ... }, img = new { attr1 = value1 } }
  

Lists

Markup

  @Html.List(EList.Unordered, new HtmlListItem[] {        // You can create an ordered list by changing the list type
    new HtmlListItem("list item 1"),
    new HtmlListItem("list item 2"),
    new HtmlListItem("list item 3"),
    new HtmlListItem("list item 4"),
    new HtmlListItem("list item 5")
  })
  

Output

Authenticated extension methods

These extension methods only return HTML content based on whether the user is authenticated or not. It uses the System.Security.Principal.IPrincipal.Identity.IsAuthenticated flag in order to decide whether a user is authenticated or not.

Usage

  @Html.AuthHyperlink(...)         // Provides all the same overloads as the @Html.Hyperlink(...) extension
  @Html.AuthImagelink(...)         // Provides all the same overloads as the @Html.Imagelink(...) extension
  

Validation extension method

This extension method allows you to check whether a particular view model property value has any model state errors. This method looks at the model state dictionary and checks whether the given view model property exists and has an error.

Usage

  @Html.IsValidFor(f => f.PropertyName)
  @Html.IsValidFor(PropertyName)
  

View renderer extension methods

These methods allow you to get the rendered content of a view in the controller. It is particularly useful if you want to return a view as a JSON callback.

Usage/Markup

  // The following controller action demonstrates how you would use these extension methods
  using WebExtras.Mvc.Core

  public class HomeController : ControllerBase
  {
    public JsonResult GetJsonView()
    {
      string content = string.Empty;
      SomeViewModel myModel = new SomeViewModel();
      if(Request.IsAjaxRequest)
        content = this.GetRenderedPartialView("mypartialviewname", myModel);
      else
        content = this.GetRenderedView("myfullviewname", "mymasterpagename", myModel);

      return Json(content, JsonRequestBehavior.AllowGet);
    }
  }
  

All available extension methods

  GetRenderedView(viewName, model);
  GetRenderedView(viewName, masterPageName, model);
  GetRenderedPartialView(partialViewName, model);
  

Rendering static HTML inline

WebExtras provides an extension method to render static HTML content inline. This is especially useful when doing content management external to the system, for e.g. system changelogs, known issues list etc.

Usage

  @Html.Inline("relative path to the static content file")
  

Label with required field asterix

Markup

@Html.LabelForV2(f => f.SomeProperty)
@Html.LabelForV2(f => f.SomeProperty, "My random label")
  

Output

All available extensions

// The displaying of the asterix is decided by inspecting the 
// System.ComponentModel.RequiredAttribute added to the view model property
@Html.LabelForV2(propertySelector)
@Html.LabelForV2(propertySelector, htmlAttributes)
@Html.LabelForV2(propertySelector, labelText)
@Html.LabelForV2(propertySelector, labelText, htmlAttributes)