I recently started reacquainting myself with the Telerik MVC Extensions, and it seems I had forgotten just how awesome they are! I want to talk about a few of the less known features I find really awesome in the extensions.

VS Extensions

Telerik’s MVC extensions come with built in Visual Studio extensions to make project creation, and configuration, a snap.  In addition, the extensions include a variety of project templates to help start new projects: 

image

 

What Makes it Awesome

Instead of forcing me to manually check for updates, the extension proactively alert me to any available updates:

image

When opening a project using an older version of the extensions, the VS Extensions even offer some assistance:

image

Total time saver! :)

Aside from the things mentioned, the provided VS extensions provide many other features you can check out here.

Script and Style Registrars

What is it?

These registrars can handle CSS and JavaScript assets for any MVC applications.  They can also bundle, compress, and set cache settings for the web assets to save web requests and bandwidth!

 

What Makes it Awesome

My favorite part of the Script and Style Registrars is that they will use the full version of scripts when the application is running in debug mode:

image

However, as soon as I set debug=false in the web.config like this:

<system.web>
 <compilation debug="false" targetFramework="4.0">
<!--Other code omitted--->

The registrars will automatically look for a .min version of the file, and use that instead when available:

image

When I was taking these screen caps, I turned of bundling and compression.  As soon as I turn them back on, the waterfall chart looks even better:

image

This is by far one of my favorite features because I no longer have to manually bundle my scripts/styles, nor do I need to remember to swap in the minified files when deploying. 

More Info

Flexible Grid Data Binding

The Telerik MVC Grid provides server, ajax, and web service binding out of the box. If none of those options meet your needs, you can also configure your own custom binding

 

What Makes it Awesome

When I start developing an application, I find myself using server binding because it is drop dead simple to implement, and more importantly, it requires less code than manually creating an html table:

@(Html.Telerik()
      .Grid(Model)
      .Name("productsList")
      .Pageable()
      .Sortable())

This small piece of code gives me a full featured grid with sorting, and paging:

image

Once I figure out the columns and commands I want to show, I end up converting to a hybrid between ajax, and server binding.  In this case, the grid is bound during the initial page request, but all subsequent paging and filtering requests are handled via ajax binding. The code looks like this:

@(Html.Telerik()
      .Grid(Model)
      .DataKeys(keys => keys.Add(item => item.Id))
      .DataBinding(dataBinding =>
      {
          dataBinding.Ajax()
                     .Select("_index", "product")
                     .Update("edit", "product")
                     .Delete("delete", "product");
      })
      .Name("productsList")
      .Columns(columns =>
      {
          columns.Command(c => c.Delete());
          columns.Command(c => c.Edit());
          columns.Bound(m => m.Name);
          columns.Bound(m => m.DateAdded).Format("{0:d}");
      })
      .Pageable()
      .Sortable())

Which results in:

image

That is still  less code than looping and manually creating an html table.  On top of that I automatically get all sorts of AJAX goodness!

NuGet Package

The NuGet package allows you to quickly add the Telerik MVC extensions to an existing MVC application using a single command without actually running an installer.

 

What Makes it Awesome

As I mentioned, you don’t need to actually download and install the MVC extensions to access the NuGet package.  I find this extremely helpful when using a VM, or other machine where I have not run the MVC installer.  Saves tons of time!

To use the NuGet package, create a new MVC application, open the package manager console, and run the following command:

Install-Package TelerikMvcExtensions

This will download, and add the open source version of the MVC extensions to your project. Simple and productive, just the way I like it. :)

More Info

Visual Style Builder

The Visual Style Builder allows developers to quickly tweak, or completely change, existing themes provided by Telerik’s MVC Extensions.

 

What Makes it Awesome

Usually when developers, or designers, need to tweak styles provided by a third party, they have to dive into their favorite tools, and figure out all the styles being utilized.  Instead of wasting time figuring out each style, and tweaking them to get it “just right”, the Visual Style Builder lets you make these changes in the browser, and see the results immediately:

image

I created the theme above, and applied it to my project, in about 1 minute (that's why it is so awesome!):

image

Can’t beat that! :)

 

That’s Not All But…

There are a lot of other great features packed into the MVC extensions, but these are the items I have been using a lot lately and wanted to pass along some information about these less known features. Hopefully you find them useful, and if you have any other features you find awesome, feel free to tell me about them! Make sure to check out Telerik's MVC extensions if you have not done so already. :)  The commercial version with dedicated support is available here, and the open source version is available here.

Happy Coding!


rahnev
About the Author

Stefan Rahnev

Stefan Rahnev (@StDiR) is Product Manager for Telerik Kendo UI living in Sofia, Bulgaria. He has been working for the company since 2005, when he started out as a regular support officer. His next steps at Telerik took him through the positions of Technical Support Director, co-team leader in one of the ASP.NET AJAX teams and unit manager for UI for ASP.NET AJAX and Kendo UI. Stefan’s main interests are web development, agile processes planning and management, client services and psychology.

Related Posts

Comments