Speaking on ASP.NET MVC5 at C# Corner Annual Conference 2014 – Apr 12

Hello All,

csharpcornerI am very excited to share you all that I’ll be speaking in C# Corner Annual Conference 2014. C# Corner Annual Conference is North India’s largest conference and hosted by http://www.c-sharpcorner.com/ from last four years.

It is a full day event and you’ll get ample opportunity to learn from renowned International/national speakers. For more details Click here

I’ll be speaking on the latest version of ASP.NET MVC (5) and discuss how it solves your real time issues and make our life easier. The agenda of my session will be

  • One ASP.NET
  • Know the power of Attribute routing
  • Authentication using external authentication providers
  • Build the rich and clean UI with Bootstrap
  • Using Authentication filters
  • Lots of demos

You’ll enjoy the day with lot of learnings and fun. See you all there..

Cheers,
Brij

 

Html.EditorFor – Extend for custom type

In this Post, I am going to discuss about ASP.NET MVC and razor view engine. As we know that ASP.NET MVC provides many helper methods that helps in generating the UI based on the model. But there could be scenario where the available HTML helpers wont work and you require to create new custom one. There could be one scenario, where you have a class that has a enum property. Now if you create a Create/Edit view for that property then it will just create a TextBox for it. Obviously which is not a good idea. A User may enter some wrong string which cannot mapped to a enum value. So the better way to provide a dropdown to select any value. There could be many ways to render it. We’ll discuss one elegant way to do this.

First let’s understand that how does the available helpers work. Lets start with an example. Say we have a class like

    public class Speaker
    {
        public int Id { get; set; }

        public string Name { get; set; }

        public bool IsAvailable { get; set; }
    }

So here, in this class there are three properties: Id, Name and IsAvaiable. The first two are of type string and third one is of bool. So when we create a View for this model It looks like

</pre>
<div class="editor-field">@Html.EditorFor(model => model.Name)
 @Html.ValidationMessageFor(model => model.Name)</div>
<div class="editor-field">@Html.EditorFor(model => model.IsAvailable)
 @Html.ValidationMessageFor(model => model.IsAvailable)</div>
<pre>

I have not included the whole source code of the View but if we see the above code then find an EditorFor (called templated helper) is used to generate the UI. Let’s run and see the UI Initial We can see one Textbox and other Checkbox on the screen right. But how does it take place? Actually when it renders on the browser, it checks the type of the property, and based on the type, picks the appropriate template and renders it on screen. For type string(which is name here), it has a defined template as Textbox and for bool (which is here IsAvailable) also it has a template as Checkbox . So the same templated editor method renders different UI based on the type of the property. Let’s move ahead and add another enum property I have created a enum type as

 public enum ExpertiseArea
    {
        ASPNET,
        Csharp,
        WindowsAzure,
        WCF
    }

Now lets add one more property to the class of type enum defined as above

public ExpertiseArea Area { get; set; }

Now we need to add a new editor for Area as

</pre>
<div class="editor-field">@Html.EditorFor(model => model.Area)
 @Html.ValidationMessageFor(model => model.Area)</div>
<pre>

When it will be rendered on UI, it will simply add a Textbox for enum as

withoutddl

which is not a good Idea as discussed. To provide a Dropdownlist for the enum, we need to create a custom editor template.

To create a custom editor template, create a folder named EditorTemplates under Views->Shared folder. So that the editor templates gets available to all the Views.Now create a Partial View under that folder with name as your Enum (which is here ExpertiseArea so partial view file name will be ExpertiseArea.cshtml). Now in this View we need to create the drop down list. For dropdown list, we need to get all the item names from the Enum Type and create the items for drop down. So here my my partial view ExpertiseArea.cshtml contains

@using System.Web.Mvc;
@using Application1.Models;
@{
    var names = Enum.GetNames(typeof(ExpertiseArea));
    var values = Enum.GetValues(typeof(ExpertiseArea)).Cast();

    var items = names.Zip(values, (name, value) =>
        new SelectListItem { Text = name, Value = value.ToString() });
}

@Html.DropDownList("", items)

In above code, We are getting all the names and values from Enum and creating the items for dropdown and once we create the items, we used the dropdown list helper to populate the dropdown. So now lets render the create the page again.

dropdownNow a dropdown is rendered with all the possible enum type values for enum type property. And the same will be used at many places, wherever we want to get the user input on this enum value. And there will be no change in the Views.

So we have seen that how easily we can create custom editors for specifc types and can use it uni formally in the entire application.

Happy Learning,
Brij

Join ‘Hands on Lab’ on ASP.NET MVC and Entity Framework with me

Hello All,

C# Corner Delhi Chapter is going to organize first event of the new year on 18th January 2014. It will be a full day event and a list of hot technologies will be discussed throughout the day.  The whole day will include two hand on labs one on ASP.NET MVC5 and other on WCF Services. Agenda of the day will be

  • Expose CRUD Operation as WCF Services (HOL) by Dhananjay Kumar
  • Get hand on Threading in C-Sharp by Suchit Khanna
  • Learn to do Unit Testing of your code using NUnit by Amit Chaudhary
  • CRUD Operation on ASP.NET MVC (HOL) by Brij Mishra

The details of the event are

Date and Timing – 18th Jan 2014, 10:30 PM to 5:00 PM

Is there any fee – No. It is Absolutely free

Venue –

MCN Solutions Pvt. Ltd.
H-217, Second Floor,
Sector-63, Noida
Landmark: Behind Indian-Oil Petrol Pump
Contact No: +91-9810371053

I’ll cover the following topics in my Hands on lab

  •     Introduction to ASP.NET MVC and ASP.NET MVC5
  •     Create MVC App performing CRUD
  •     Create model using Entity Framework
  •     Authentication using external Identity Providers

For more details and registration Click here

Come with your friend and learn with us. See you all at the event.
Cheers,
Brij

WebGrease : A fantastic tool for Web Optimization

In this post, We are going to talk a library that you guys must have seen in latest version of ASP.NET (4.5) and ASP.NET MVC (4.0). So first let’s first understand,

What is WebGrease?

WebGrease is a suit of tools that helps is optimizing the static files (like JavaScript, CSS) in a web application. This tool is developed by a performance team in MSN division of Microsoft . Actually It is evolution of the AJAX min library that we are already using.  This team continuously works on the optimization of their web sites. So the current capabilities of WebGrease are

Continue reading

Presented on ASP.NET MVC and AJAX at C# Corner Delhi Chapter event

Hi All,

Again we had a very successful event at C# Corner Delhi Chapter July meet on 20the July. This time again despite bad weather, it was attended by more that 100 attendees and we discussed a list of hot technologies. This time Mahesh Chand sir, the founder of C# Corner was also present and discussed about Enterprise architecture.

Continue reading

Working with WebGrid using AJAX : ASP.NET MVC

I am going to write another post on ASP.NET MVC. Here in this post, I’ll be talking about WebGrid. If you have read my last post ( to go Click here), I had a main View and many Partial Views that are integrated with main View. Every partial view was independent and we loaded each partial view via jQuery AJAX call.

I got another requirement to have one more partial view on that page which also shows the data similar to other controls but here the requirement was to provide a specific feature Sorting. So as I was looking for various options for it. First I thought to making my custom partial view which provides the desired behavior. But I thought of using any existing control.

Continue reading

Loading the partial views using Ajax for Beginners

Last week, I was working on an application that was made in ASP.NET MVC3. Earlier I thought of using ASP.NET MVC 4 but didn’t find any specific feature of ASP.NET MVC4 so moved ahead with ASP.NET MVC3 version.

So as I worked on a POC using with ASP.NET MVC initial version long back so I was excited working on it. I had to display multiple user controls and the data of these controls was getting picked up from multiple sources. So I thought of loading the controls via ajax call individually. So let me share my understanding with a example. I have created a sample application in ASP.NET MVC3. I created a main View (called here HomePage.cshtml)and created two Partial Views (_ProductDetails.cstml and _UserDetails.cshtml) that will be displayed. So I’ll show you how easily we can load these controls via Ajax. It will make page more intuitive and seamless to users.

Continue reading