Model binding with ASP.NET 4.5 and Visual Studio 2012

Note:I have written a whole series of Visual Studio 2012 features and this post will also be part of same series. You can get the whole list of blogs/articles from the Visual studio 2012 feature series posts there. Following is a link for that.Visual Studio 2012 feature series

In earlier version of the asp.net we have to bind controls with data source control like SQL Data source, Entity Data Source, Linq Data Source if we want to bind our server controls declaratively. Some developers prefer to write whole data access logic and then bind the data source with databind method. Model binding is something similar to asp.net mvc binding.

Model Binding in ASP.NET 4.5 and Visual Studio 2012:

With ASP.NET 4.5 and Visual studio 2012 we have a new method of binding data called ‘ Model binding’. It’s a code focus approach of data binding. Now all the controls will have ItemType property which will implement strongly type binding. The server controls will then call appropriate methods at the proper time in page life cycle and bind the data.

So what we are waiting for ? let’s take one example. First we need to create a model. For the this I have created a model class called ‘Customer’. Following is code for that.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace WebApplication2
{
    public class Customer
    {
        public int CustomerId { get; set; }
        public string CustomerName { get; set; }
    }
}

Now our model class is ready so it’s time to create the asp.net grid view in html with ItemType property which will directly bind the customer model class to grid view. Following is a HTML code for that.

<asp:GridView ID="grdCustomer" runat="server" ItemType="WebApplication2.Customer" AutoGenerateColumns="false" SelectMethod="grdCustomer_GetData">
   <Columns>
       <asp:TemplateField HeaderText="Customer Id">
          <ItemTemplate>
              <asp:Label ID="lblCustomerId" runat="server" Text="<%#Item.CustomerId%>"></asp:Label>
          </ItemTemplate>
       </asp:TemplateField>
       <asp:TemplateField HeaderText="Customer Name">
           <ItemTemplate>
               <asp:Label ID="lblCustomerName" runat="server" Text="<%#Item.CustomerName%>"></asp:Label>
           </ItemTemplate>
       </asp:TemplateField>
   </Columns>
</asp:GridView>

Here in the above code we can see that I have two template field column, one for customer id and another for customer name and I have putted the two label control separately for customer Id and Customer Name. Also I have written a select method name which will return a IQueryable of customer model class. Following is a server side code for that.

public IQueryable<WebApplication2.Customer> grdCustomer_GetData()
{
    List<Customer> customerList = new List<Customer>();
    customerList.Add(new Customer {CustomerId=1,CustomerName="Jalpesh" });
    customerList.Add(new Customer { CustomerId = 2, CustomerName = "Vishal" });
    return customerList.AsQueryable<Customer>();
}

Now that’s it. It’s time to run application. Its working fine like following.



Hope you like it. Stay tuned for more. Till then happy programming.