Nirbhay Anand

NEW ADDITION TO VS 2013

2014-02-07T17:58:00.001+05:30

NEW ADDITION TO VS 2013

ASP.NET APP SUSPENDED

2014-02-07T17:57:00.000+05:30

With the release of .NET Framework 4.5.1 Microsoft has introduces a new terminology “SUSPEND” . Lets us learn together what this SUSPEND is all bout and what it does.

ASP.NET App suspend is built on top of another new feature in windows server 2012 R2, called IIS Idle worker process Page-out to know more about this you can visit the following link [ http://www.iis.net/learn/get-started/whats-new-in-iis-85/idle-worker-process-page-out-in-iis85 ].

ASP.NET App suspend is a new implementation of the IIS feature. This is a self-tuning mechanism for web hosting, something like CLR GC generation . The addition of suspend sets the three state of the site on a given machine.

Inactive sites
Active sites
Suspended sites

All sites that are hosted start with Inactive site,as there is a request by user for a site it is loaded into memory and become active and respond to the request here the state changes to Active Site,Later when the site is idle as determined by the timeout setting they become suspended.

The site which are in the suspended state lose access to CPU,making CPU cycle and memory available for other sites. The suspended state site respond more faster then Inactive sites.

Hybrid Mobile Application Development with Telerik’s Icenium & Kendo UI Mobile

2013-08-27T16:06:00.001+05:30

Yesterday i attended the HOL session from Telerik, A very informative session it was.

The cenium enables you to use HTML5, CSS and JavaScript to develop, test, and publish applications that runs on IOS and Android.

The Application can be developed on the IDE that is Graphite, this can be downloaded and installed on your desktop. The alternative option for development is using MIST that can be opened on the Web browser.

Following are the Features supported by the IDE

1.IDE with Intellisense
2. Kendoui
3. Icenium
4. Cloud hosting
5 Version Control
6 TFS work item manager
7.Certificate Management
8.Live testing and troubleshooting on different devices

for more details you can visit there website
http://www.icenium.com/

To download Graphite : http://cdn.icenium.com/live/graphite/publish/setup.exe
For MIST http://app.icenium.com/mist

Soon i will be coming up with the Example of how to develop a simple mobile application using the new framework.

MVC 5 New Features

2013-08-05T16:58:00.002+05:30

In software market people as still opting MVC 3 and MVC 4 in there respective projects, Microsoft is focused on improving the MVC framework. Now soon we will see MVC 5 in the market.

To give a brief overview of the new features that MVC 5

Authentication filters : This filters will run prior to authorization filters in Asp.Net Pipeline and will help developers to specify authentication logic per-action,per-controller or at global level for all the controllers.
Filter overrides: override filters specify a set of filter types that should not be run for a given scope [action or controller]
ASP.NET Identity for authentication and identity management
MVC template has been updated with Bootstrap to provide sleek and responsive look and feel

MVC +WEBAPI +KendoUI Sample project

2013-07-10T16:09:00.000+05:30

Download the application form following location

https://drive.google.com/folderview?id=0B1N7j4r5VvcrakZ5dEFOVTlUUms&usp=sharing

Here i have demonstrated how we can use kendo UI with MVC and WEB API. There are various ways to do this, this is one of the way.

MVC Web API Quick reference topics

2013-07-10T16:02:00.000+05:30

Asp.net Web API
There are 3 ways in which we can Host
1.Web-Hosted
2.Self-Hosted
3.Third-Party

What is HttpPatch?

2013-07-10T16:00:00.002+05:30

Several applications extending the Hypertext Transfer Protocol (HTTP)
require a feature to do partial resource modification. The existing
HTTP PUT method only allows a complete replacement of a document.
This proposal adds a new HTTP method, PATCH, to modify an existing
HTTP resource.

To read more you go to the link below.

https://tools.ietf.org/html/rfc5789#page-2

Difference between MVC application and MVC WEB API Application

2013-02-16T21:34:00.002+05:30

•Web API does not share the Model-View-Controller design of MVC

•Web API directly renders the resulting model object as the response

•Base Class is ApiController where as in MVC we have Controller

•Methods in the controller return raw objects rather than views (or other action helper objects)

•Web API controllers by default dispatch to actions by HTTP verb where as MVC controllers always dispatch to actions by name.

•ApiController is defined in the namespace System.Web.Http and MVC controller is defined in System.Web.Mvc

• Web API controllers are asynchronous by design.

• Different Execution Pipeline because rather than having access to a Response object, API controllers are expected to return a response object of type HttpResponseMessage

•Only a single value can come from the body, and that value must represent the entirety of the body

•Incoming parameters which are not part of the body are handled by a model binding system that similar to the one included in MVC. Incoming and outgoing bodies, on the other hand, are handled by a brand new concept called formatters.

•In MVC When an action returns a raw object, Web API will automatically convert it into a structured response in the desired format (like JSON or XML) using a feature of Web API called Content Negotiation.

Console application-Using Razor Engine to fill template

2012-11-14T14:01:00.000+05:30

Now a days we all are hearing about Razor Engine in MVC ,People are using the Razor syntax to build there Web Application.

We are going to use a template engine built upon Microsoft's Razor parsing technology.you can download it form http://razorengine.codeplex.com/#

Here we will see how we can fill the predefined template values,using the model .

One scenario where it is useful is say you have a multiple template that needs to be filled on the basis of the model supplied and then we need to send a email.

Lets see how to use the Razor Engine to fill the given template that will be displayed on the Window.Here i am using the console application.

Create the following model

 namespace RazorEngine_Implementation  
 {  
   public class Employee  
   {  
     public int Id { get; set; }  
     public string Name { get; set; }  
     public string Address1 { get; set; }  
     public string Address2 { get; set; }  
     public int PinCode { get; set; }  
     public int Mobile { get; set; }  
   }  
 }

Now will Create Couple of Interfaces and Classes to Render The Initialization of Template and Initialization of model

 namespace RazorEngine_Implementation  
 {  
   public interface ITemplate  
   {  
     string GetTemplate(TemplateType template);  
   }  
 }

 namespace RazorEngine_Implementation  
 {  
   internal interface IRendorTemplate  
   {  
     /// <summary>  
     /// Employee template  
     /// </summary>  
     /// <returns></returns>  
     string CreateTemplate(TemplateType type);  
   }  
 }

 namespace RazorEngine_Implementation  
 {  
   public class Template : ITemplate  
   {  
     public string GetTemplate(TemplateType template)  
     {  
       switch (template)  
       {  
         case TemplateType.Employee:  
           {  
             return "Employee Details Id=@Model.Id,Name=@Model.Name,Address1=@Model.Address1," +  
                 "Address2=@Model.Address2,Pin=@Model.PinCode,Mobile=@Model.Mobile";  
           }  
       }  
       return string.Empty;  
     }  
   }  
 }

 namespace RazorEngine_Implementation  
 {  
   public enum TemplateType  
   {  
     Employee  
   }  
 }

 namespace RazorEngine_Implementation  
 {  
   public class RendorEmployeeTemplate : IRendorTemplate  
   {  
     public string Template { get; set; }  
     public Employee Employee { get; set; }  
     public RendorEmployeeTemplate()  
     {  
       Template = CreateTemplate(TemplateType.Employee);  
     }  
     public string CreateTemplate(TemplateType type)  
     {  
       Employee= InitializeEmployee();  
       var template = new Template();  
       return template.GetTemplate(type);  
     }  
     public Employee InitializeEmployee()  
     {  
       return new Employee()  
               {  
                 Id = 1,  
                 Name = "David",  
                 Address1 = "North Hill",  
                 Address2 = "DC",  
                 Mobile = 7651132,  
                 PinCode = 87658  
               };  
     }  
   }  
 }

Next we will Create a Console application and in the Main() will will put the following code and we will add the Reference of the RazorEngine and if you have created the Separate DLL for the above code add its reference.

  var template = new RendorEmployeeTemplate();  
       Console.WriteLine(Razor.Parse(template.Template, template.Employee));  
       Console.ReadLine();

In the above code we you can see Razor.Parse(Template,Model). this is the function that has been exposed by razor DLL.

Happy Coding

MVC -SelectedList

2012-10-26T08:24:00.003+05:30

Today we will see a small example of how to use SelectedList. It comes under the namespace System.Web.Mvc.

This list basically helps you to represent a list that let user to select item.

To start with we will create a Model say SelectListExampleModel.cs

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

namespace SubmitTest.Models
{
    public class SelectListExampleModel
    {
        public SelectListExampleModel()
        {
            if (Items == null)
            {
                Items = new List<Item>();
            }
        }
        public SelectList ItemList { get; set; }
        public List<Item> Items { get; set; }
        public int ItemList1 { get; set; }
    }
    public class Item
    {
        public int ItemId { get; set; }
        public string ItemName { get; set; }
    }
}

HomeController.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using SubmitTest.Models;

namespace SubmitTest.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            ViewBag.Message = "Welcome to ASP.NET MVC!";

            //Lets create a list of items here
            

            var selectedList = new SelectListExampleModel();
            Item item = new Item();
            item.ItemId = 1;
            item.ItemName = "Bread";
            selectedList.Items.Add(item);
            Item item1 = new Item();
            item1.ItemId = 2;
            item1.ItemName = "Butter";
            selectedList.Items.Add(item1);
            selectedList.ItemList = new SelectList(selectedList.Items, "ItemId", "ItemName");

            return View(selectedList);
        }
        [HttpPost]
        public ActionResult Index(SelectListExampleModel model)
        {
            ViewBag.Message = "Welcome to ASP.NET MVC!";

          

           var selected= model.ItemList1.ToString();


           return View(model);
        }

        public ActionResult About()
        {
            return View();
        }
    }
}

Lets have a view Named Index.cshtml

@model SubmitTest.Models.SelectListExampleModel

@{
    ViewBag.Title = "Home Page";
}

<h2>@ViewBag.Message</h2>
<p>
    To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
</p>
 @using (Html.BeginForm())
 {
     @Html.DropDownList("ItemList1", Model.ItemList, "- Please Select -")
     <input type="submit" value="Get Selected Value" />
     
 }

Happy Coding :)

IE Issue -HTML 5 Button with Jquery submit() event

2012-10-19T15:47:00.000+05:30

If you are using the HTML 5 button tag and inside it you are calling submit() that is of Jquery, In IE browser you will notice that the event gets trigger 2 times.This seems to be issue with browser.It works well on Firefox,chrome.

Basically do not use the following syntax inside the form tag if you are supporting the IE else you will have to do some trick to avoid first or second call.

@using (Html.BeginForm()){

<button onclick="submit()">"Create"</button>

}

Happy Coding :)

Difference Between Firebug and Fiddler

2012-10-18T12:17:00.000+05:30

In this Article we will some differences between Firebug and Fiddler

Fiddler and Firebug are two different tools that we use to solve two different problems.

Firebug

Firebug is primarily used to Inspect / Tweak the DOM, script debugging, and basic network information. It primarily deals with things inside the browser.

Some things you would use Firebug for is tweaking CSS styles, trying to figure out where some style is coming from, etc. It can also be used for breakpoints in JavaScript, and basic request / response information such as content, headers, timing, etc.

Fiddler

Fiddler goes much further underneath of it. Fiddler is useful for inspecting network / protocol level information that the browser is doing, as well has a lot of analysis helpers.We typically use this when We are trying to diagnose compression issues, see network traffic, very fine grained details for timing, or making your own requests to the server, which we do when we are tinkering with SOAP / Web Services.

MVC3- PartialViewResult as a Modal Dialog

2012-09-13T14:48:00.000+05:30

Today we will see how we can display partial view result as a modal dialog

The partial view

 @model ReloadPartial.Models._UserModel  

 @using (Html.BeginForm("Validation","Home", FormMethod.Post, new { id = "UsrValidation" }))  

 {  

   <h3>  

     @Html.ValidationSummary()  

   </h3>  

   @Html.Raw("User Name:")  

   @Html.TextBoxFor(m => m.UserName)  

   <br />  

   @Html.Raw("Email:")  

   @Html.TextBoxFor(m => m.Email)  

   <br />  

   <input type="button" value="!!Action!!" onclick="SubmitForm();" />  

 }

Now lets see the controller implementation

 public PartialViewResult Validation(_UserModel model)  
     {  
       ModelState.Clear(); //important to see changes in UI  
       if (ModelState.IsValid)  
       {  
         //Can perform any action 
       }  
       return PartialView("_User",model);  
     }

JavaScript

 <script language="javascript" type="text/javascript">  
   function SubmitForm() {  
     //select and serialize our small form  
     var frm = $("#UsrData").serialize();  
     // get form action  
     var action = $("#UsrData").attr("action");  
     $.ajax({  
       url: action, // or '@(Url.Action("Validation"))',  
       cache: false,  
       async: true,  
       type: "POST",  
       data: frm, //data to post to server  
       error: function (html) { alert(html); }, //something goes wrong...  
       success: function (data) {  
         showDialog(data);  
       }  
     });  
   }  
 function showDialog(data) {  
    $("#UsrData").html(data);  
   $("#UsrData").dialog({  
     modal: true,  
     title: "Details",  
     resizable: false,  
     open: true,  
     height: 150,  
     width: 200,  
     position: 'center',  
     buttons: [{ text: "Ok", click: function () {  
       $(this).dialog("close");  
       $(this).html('');  
     }  
     }]  
   });  
 }  
 </script

Event Aggregation In Javascript

2012-08-28T09:45:00.000+05:30

The Event Aggregator service is primarily a container for events that allow decoupling of publishers and subscribers so they can evolve independently. This decoupling is useful in modularized applications because new modules can be added that respond to events defined by the shell or, more likely, other modules.

Lets see the example of using Event Aggregation pattern in java script.

Suppose we have two different JavaScript pages attach with different Views/HTML page and we want to notify one if a particular event has occurred so thet on the basis of the event it can perform some action.

Here we will first create a common .js file which will have a event argument and events defined.

 var Events = {  
   OnAdded: "OnAdded",  
   OnClicked: "OnClicked",  
   OnUpdated: "OnUpdated"  
 };  
 var EventArgunments = {  
   Selectedvalue: ""  
 };

Now on the page where we want to publish or want to subscribe the events we need to cal in the following way

 To publish event the syntax is   
  $(document).trigger(window.Events.OnClicked, window.EventArgunments);

To Subscribe event syntax is

 To Subscribe event the syntax is   
  $(document).bind(window.Events.OnClicked, function (e, eventArgunments)  
  {  
      //code Logic goes here  
 }

Happy Coding :)

Microsoft finally shuts Hotmail, introduces outlook.com

2012-08-02T08:58:00.000+05:30

Microsoft moves from Hotmail to outlook.com. We have all the features integrated in this.
Preview below.

Kendo UI: Iterations on Hierarchical data Source

2012-07-19T06:37:00.000+05:30

If you are looking into populating the hierarchical data source using Keno framework, First of all you need to use [ kendo.data.HierarchicalDataSource] and the structure should be something like

 var dataSource = kendo.data.HierarchicalDataSource({  
   type: "json",  
   transport: {  
     read: {  
       url: "/test",  
       datatype: json,  
       type: "POST",  
       contentType "application/json;charset=utf-8",  
     }  
   },  
   schema: {  
     model: {  
       hasChildren: "hasChildren"  
     }  
   }  
 });

Here hasChildren value comes from your controller with the data,depending upon if the parent has any child node attach. so when you return data from controller make sure you have hasChildren field defined and that should be a bool value.

 <div id="dTree">  
 </div>  
 <script type="text/javascript">  
   var Tree;  
   var Root;  
   $(document).ready(function () {  
     Root = new kendo.data.HierarchicalDataSource({  
       transport: {  
         read: {  
           url: document.URL + "/GetTreeData/",  
           dataType: "json"  
         }  
       },  
       schema: {  
         model: {  
           id: "Id",  
           hasChildren: "HasChildren"  
         }  
       }  
     });  
     Tree = $("#dTree").kendoTreeView({  
       dataSource: Root,  
       dataValueField: "Id",  
       dataTextField: "Name",  
       select: function (e) {  
         var selecteddata = null;  
         if ($.browser.msie)  
           selecteddata = Root.getByUid(e.node.attributes[1].nodeValue);  
         else  
           selecteddata = Root.getByUid(e.node.attributes[0].nodeValue);  
         UnitEventArgunments.Selecteddata = selecteddata;  
         UnitEventArgunments.SelectedTreeNode = e;  
         $(document).trigger(OnNodeEvents.OnNodeUnitClicked, UnitEventArgunments);  
       }  
     });  
                //This is the event that will be triggered when node has been added  
     $(document).bind(OnNodeEvents.OnNodetAdded, function (e, args) {  
       refreshTreeView(args);  
     });  
   });  
   function refreshTreeView(e) {  
     
     var uId = new Array();  
     if ($.browser.msie)  
       selectedNodeData = Root.getByUid(e.node.attributes[1].nodeValue);  
     else  
       selectedNodeData = Root.getByUid(e.node.attributes[0].nodeValue);  
     var childData = selectedNodeData.children._data;  
     for (var i = 0; i < childData.length; i++) {  
       uId[i] = childData[i].uid;  
     }  
     for (var j = 0; j < uId.length; j++) {  
       var item = Tree.data("kendoTreeView").dataSource.getByUid(uId[j]);  
       Tree.data("kendoTreeView").dataSource.remove(item);  
     }  
     appendNode(selectedNodeData);  
   }  
   function appendNode(selectedNodeData) {  
     $.post("/GetTreeData", { Id: selectedNodeData.Id },  
         function (data) {  
           Tree.data("kendoTreeView").append(data, $("[data-uid=" + selectedNodeData.uid + "]"));  
         });  
   }  
 </script>

Kendo UI :Web development framework- Part 2

2012-06-29T00:48:00.000+05:30

The MVVM model is most popular now a days . Here we will see with the sample example the use of MVVM in MVC.

To start with MVVM we need to first create a View Model, A view model is an observable object. This object has properties and methods. Each property will be bound to something in the HTML. In MVVM, this binding is two way, meaning that if the binding changes on the UI, the model changes, and vice versa.

Let us take a sample example where we will take display a grid and a drop down box, firstly i will create a HTML controls for grid and drop-down. And grid will be using a Template column.

 <script id="rowTemplate" type="text/x-kendo-tmpl">  
   <tr>  
     <td>${ UserName }</td>  
     <td>${ GroupName }</td>  
     <td>  
      <input type="image" id="btnremove" src="/Content/Images/DeleteIcon.gif" data-bind='events { click : removeUser }, enabled: btnSaveIsEnabled' style="width:20px;height:20px;"/></td>  
   </tr>  
 </script>  
 <div id="UserTab">  
   <div id="userGrid" data-role="grid" data-bind="source: User.UsersOf"  
     data-row-template="rowTemplate" data-columns='["User", "Group", "Remove" ]' data-pageable='{"pageSize":10}'>  
   </div>  
   <table style="width: 100; margin-top: 20px; margin-bottom: 20px">  
     <tr>  
       <td style="width: 45%">  
         <select id="dduser" data-role="dropdownlist" data-value-field="Id" data-text-field="Name"  
           data-bind="source: User.AllowableUsers, value: selectedUser, events: { change : userSelectChange }" />  
       </td>  
       <td style="width: 45%">  
         <select id="ddgroup" data-role="dropdownlist" data-value-field="Id" data-text-field="Name"  
           data-bind="source: User.AllowableGroups, value: selectedGroup, events: { change : groupSelectChange }" />  
       </td>  
       <td style="width: 10%">  
         <button id="btnSave" class="k-button" style="width: 75px" data-bind='events { click : addUser }, text: addUserText, enabled: btnSaveIsEnabled'>  
         </button>  
       </td>  
     </tr>  
   </table>  
   <a href='@Url.Action("Create", "Group", new { })' style="color: Blue; text-decoration: true;">  
     Add New Group</a><br />  
   <a href='@Url.Action("Index", "Type", new { })' style="color: Blue; text-decoration: true;">  
     Add New Type</a>  
 </div>

Here we have created a UserViewModel that is binded to the div id :UserTab, This example also shows how to add and delete user using MVVM pattern.

 <script language="javascript" type="text/javascript">  
   $(document).ready(function () {  
     var UserViewModel = kendo.observable({  
       UserSource: new kendo.data.DataSource({  
         transport: {  
           read: {  
             url: document.URL + "/GetUser/",  
             dataType: "json",  
             type: "post",  
             complete: function (e) {  
               if (UserViewModel.UserSource == null) return;  
               UserViewModel.set("User", UserViewModel.UserSource.at(0));  
             },  
             data: { Id: 0, TypeId: 0 }  
           },  
           update: {  
             url: document.URL + "/AddUserToUser/",  
             dataType: "json",  
             type: "post",  
             complete: function (e) { }  
           },  
           parameterMap: function (options, operation) {  
             if (operation !== "read" && options.models)  
               return { models: kendo.stringify(options.models) };  
             return options;  
           }  
         },  
         schema: {  
           model: { id: "Id" }  
         }  
       }),  
       User: null,  
       selectedGroup: null,  
       selectedUser: null,  
       Id: 0,  
       TypeId: 0,  
       btnSaveIsEnabled: false,  
       addUserText: 'Add',  
       groupSelectChange: function (e) { },  
       userSelectChange: function (e) { },  
       load: function (e) {  
         this.set("Id", e.Id);  
         this.set("TypeId", e.TypeId);  
         this.UserSource.read({ Id: e.Id, TypeId: e.TypeId });  
         $("#dduser").val("").data("kendoDropDownList").text("--Choose User--");  
         $("#ddgroup").val("").data("kendoDropDownList").text("--Choose Group--");  
       },  
       addUser: function (e) {  
         if (this.get("selectedUser") == null || this.get("selectedGroup") == null) {  
           alert("Please select User and Group");  
           return;  
         }  
         if (IsUserExist(this.get("selectedUser").Id, this.get("selectedGroup").Id)) {  
           alert("User already exist");  
           return;  
         }  
         var Id = this.get("Id");  
         var TypeId = this.get("TypeId");  
         $.post("/AddUserToUser", { Id: this.get("Id"), groupId: this.get("selectedGroup").Id, userId: this.get("selectedUser").Id },  
         function (data) {  
           if (data) {  
             UserViewModel.UserSource.read({ Id: Id, TypeId: TypeId });  
             aler("User/Group Added");  
           }  
           else  
             growlSad("User not Added");  
         });  
       },  
       removeUser: function (e) {  
         if (confirm("Are you sure you want to delete this user from group?")) {  
           var Id = this.get("Id");  
           var TypeId = this.get("TypeId");  
           $.post("/DeleteUser", { UserId: e.data.UserId },  
         function (data) {  
           UserViewModel.UserSource.read({ Id: Id, TypeId: TypeId });  
         });  
         }  
       }  
     });  
     kendo.bind($("#UserTab"), UserViewModel);  
     $(document).bind(Events.OnClicked, function (event, args) {  
       UserViewModel.load({ Id: args.Selected.Id, TypeId: args.Selected.TypeId });  
       UserViewModel.set("btnSaveIsEnabled", args.Selected.IsActive);  
     });  
     $(document).bind(window.Events.OnUpdated, function (e, args) {  
       ResetFormUser();  
     });  
     function IsUserExist(userId, groupId) {  
       var gridDataSource = UserViewModel.UserSource._data[0].UsersOf;  
       for (var i = 0; i < gridDataSource.length; i++) {  
         if (userId == gridDataSource[i].UserId && groupId == gridDataSource[i].GroupId)  
           return true;  
       }  
       return false;  
     }  
     function ResetFormUser() {  
       UserViewModel.load({ Id: 0, TypeId: 0 });  
       UserViewModel.set("btnSaveIsEnabled", false);  
     }  
   });  
 </script>

Happy Coding :)

Kendo UI :Web development framework- Part 1

2012-06-28T05:27:00.000+05:30

Couple of days back i came to learn about a web UI frame work known as Kendo UI. A framework that is for HTML5 apps, It is jQuery-based which also includes MVVM support ,rich Data Source and several UI widgets.

Currently i am using the MVVM framework for the UI development and the widgets like Grid Control,Splitter,Tree view, and Validation framework provided by Kendo.

The best part of the kendo UI is that your development time for the UI is very low, lets take a example of the Kendo Grid. It has a built in feature for Paging,Searching, shorting and filtering,editing on each column.

With the rich data source you can directly bind a view model on the grid and what ever changes you are doing on the grid can be updated in the data base in a single go. I am using the Entity Framework for the batch update . We as a developer need not worry about tracking the changes. we just need to add couple of methods provided by this framework and we are done.

Soon i will be updating this article with some example and coding pattern that are used here.

Visual Studio 2012 IDE-First Look

2012-06-23T23:14:00.000+05:30

Today i was exploring VS2012, It looks pretty exciting. Here are some of the glimpse of IDE

New Top level menu like Architecture and Analyze

New Look and feel

Option to select the browser when running the application from IDE

Couple of good option in Analyze

Can create new diagrams in Architecture menu

Project Files

New Refactor Menu

Code Analysis in Build Menu

Will come with more finding in my next post.

Entity Framework 4 - Batch Updates

2012-06-20T23:50:00.003+05:30

This article explains the batch update of data into data base using the Entityframework4.

Problem Statement: We have a List of customer that needs to be updated in the data base.
I will directly jump on the code.

Here is the function which does the Batch update in a single database hit.

 public JsonResult Update(List<Customer> models)  
     {  
       using (var context = new NorthwindEntities())  
       {  
         //Attach each entity to a context entity  
         models.ForEach(a => context.Customers.Attach(a));  
         //Change all the object state to Modified  
          models.ForEach(s => context.ObjectStateManager.ChangeObjectState(s,   
                        EntityState.Modified));               
         //Save changes to the database    
         context.SaveChanges();  
       }  
        //Return the result  
       return Json(Details());  
     }

Note: Instead EntityState.Modified you can use Added/Deleted/Detached

Happy Coding :)

Hierarchical-Data in Organization Structure View

2012-06-08T03:29:00.002+05:30

While going through an interesting assignment i got to learn how to play with Hierarchical Database where the data in the data base are stored in the following format

Here the main challenge was to display the data in the following format

As we have may tree view structure available in the market, but they don't provide a org structure look & feel.

I took the reference of http://dl.dropbox.com/u/4151695/html/jOrgChart/example/example.html and created a customized structure using which we can dynamically create organization structure.

Bellow is the location where i have kept the code and Database

Display-Hierarchical-Data Source Code
Database

When you build and run the code you need to provide the path as

http://localhost:[Port Number]/employeeTree/index

Happy Coding :)

EF Code First:Executing Stored Procedure

2012-05-23T12:41:00.000+05:30

Code First in Entity Framework does not support Stored Procedure by default. We can not even map our Stored procedure to Entity. There are a many scenario we have seen where we are bound to use stored procedure for any database modifications (insert/update/delete). Here is how we can use stored procedure.

Here i have created two Entities

 public class Employee  
   {  
     public int Id { get; set; }  
     public string Name { get; set; }  
   }  
   public class Address:Employee  
   {  
     public string Address1 { get; set; }  
     public string Address2 { get; set; }  
     public string City { get; set; }  
     public int Pin { get; set; }  
   }

--------------------------------------------------------------------------------------------------------------------------------------------------------------------

Now we create EmployeeDBContext

 public class EmployeeContext : DbContext  
   {  
     public DbSet<Employee> EmployeeSet { get; set; }  
     public DbSet<Address> Address { get; set; }  
     public void AddEmp(Address Emp)  
     {  
       this.Database.ExecuteSqlCommand("exec AddEmpData @Name,@Address1,@Address2,@City,@pin,@Discriminator",  
               new SqlParameter("@Name", Emp.Name),  
               new SqlParameter("@Address1",Emp.Address1),  
               new SqlParameter("@Address2", Emp.Address2),  
               new SqlParameter("@City", Emp.City),  
               new SqlParameter("@Pin", Emp.Pin),  
               new SqlParameter("@Discriminator", "Address"));  
     }  
     protected override void OnModelCreating(DbModelBuilder modelBuilder)  
     {  
       modelBuilder.Conventions.Remove<PluralizingTableNameConvention>();  
     }  
   }

--------------------------------------------------------------------------------------------------------------------------------------------------------------------

 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Text;  
 using System.Data.Entity;  
 namespace Calling_SP  
 {  
   class Program  
   {  
     static void Main(string[] args)  
     {  
       var Address = new Address  
       {  
         Name="Nirbhay",  
         Address1 = "Wakad-1",  
         Address2 = "Silver Society",  
         City = "pune",  
         Pin = 411010  
       };  
       //Save Data to database        
       using (var context = new EmployeeContext())  
       {  
         context.AddEmp(Address);  
       }  
       Console.Write("Person saved !");  
       Console.ReadLine();  
        //Retrieving data from Database  
       using (var context = new EmployeeContext())  
       {  
         var result = context.Address.SqlQuery("GetEmpData").ToList<Address>();  
         foreach (var item in result)  
         {  
           Console.Write(item.Id);  
           Console.Write(item.Name);  
           Console.Write(item.Address1);  
           Console.Write(item.Address2);  
           Console.Write(item.City);  
           Console.Write(item.Pin);  
           Console.WriteLine();  
         }  
       }  
       Console.ReadLine();  
     }  
   }  
 }

--------------------------------------------------------------------------------------------------------------------------------------------------------------------

In App.Config set the desired connection string

 <?xml version="1.0" encoding="utf-8" ?>  
 <configuration>  
  <connectionStrings>  
   <add name="EmployeeContext" connectionString="data source=SY113;initial catalog=Employee;integrated security=True;" providerName="System.Data.SqlClient"/>  
  </connectionStrings>  
 </configuration>

--------------------------------------------------------------------------------------------------------------------------------------------------------------------

Stored Procedure

 USE [Employee]  
 GO  
 /****** Object: StoredProcedure [dbo].[AddEmpData]  Script Date: 05/23/2012 12:27:49 ******/  
 SET ANSI_NULLS ON  
 GO  
 SET QUOTED_IDENTIFIER ON  
 GO  
 CREATE procedure [dbo].[AddEmpData]  
 @Name nvarchar(max),  
 @Address1 nvarchar(max),  
 @Address2 nvarchar(max),  
 @City nvarchar(max),  
 @Pin int,  
 @Discriminator nvarchar(128)  
 AS  
 Begin  
 insert into Employee (Name,Address1,Address2,City,Pin,Discriminator)  
 values  
 (@Name,@Address1,@Address2,@City,@Pin,@Discriminator)  
 End  
 GO  
 *********************************************************************************************  
 USE [Employee]  
 GO  
 /****** Object: StoredProcedure [dbo].[GetEmpData]  Script Date: 05/23/2012 12:28:34 ******/  
 SET ANSI_NULLS ON  
 GO  
 SET QUOTED_IDENTIFIER ON  
 GO  
 Create procedure [dbo].[GetEmpData]  
 AS  
 Begin  
 select * from Employee  
 End  
 GO

---------------------------------------------------------------------------------------------------------------------------------------------------------------------

Following are the 2 tables Created By EF.

You can see in the above DB Diagram there is a field Called Discriminator, it is Created by EF because we have inherited Employee Class in Address and the value for this field is Address.

Using Model Metadata

2012-05-18T10:19:00.001+05:30

When we are using Runtime Scaffolding to generate view, We are using @Html.EditorForModel() so here it will populate the model for editing but if we want some fields that should be non editable that we use the model meta data feature, The name space that we need to include is System.Web.Mvc .

Following are some of its attribute that we can use:

[HiddenInput] : If we don't want the property to be editable
[HiddenInput(DisplayValue=false)] : If we don't want to display the value.

The Fields will be generated in the html but the value will be hidden. If you are using [ScaffoldColumn(false)] the column will not be generated.

Bellow is the example that explains the usage.
-------------------------------------------------------------------------------------------------------------

 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Web;  
 using System.ComponentModel.DataAnnotations;  
 using System.Web.Mvc;  
 namespace Using_Model_Metadata.Models  
 {  
   public class Product  
   {  
     [HiddenInput]  
     public int Id { get; set; }  
     public string Name { get; set; }  
     public string Category { get; set; }  
     public decimal Price { get; set; }  
   }  
 }  
 -------------------------------------------------------------------------------------------------------------  
 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Web;  
 using System.Web.Mvc;  
 using Using_Model_Metadata.Models;  
 namespace Using_Model_Metadata.Controllers  
 {  
   public class ProductController : Controller  
   {  
     //  
     // GET: /Product/  
     public ActionResult Index()  
     {  
       return View(GetProduct());  
     }  
     public Product GetProduct()  
     {  
       Product product = new Product { Id = 1, Name = "Kayak", Category = "Watersports", Price = 275m };  
       return product;  
     }  
   }  
 }  
 -------------------------------------------------------------------------------------------------------------  
 @model Using_Model_Metadata.Models.Product  
 @{  
   ViewBag.Title = "Index";  
 }  
 <h2>Index</h2>  
 @Html.EditorForModel()

-------------------------------------------------------------------------------------------------------------
Output

Rendering a Child Action

2012-05-17T12:21:00.002+05:30

You can invoke a child action using the Html.Action helper. With this helper, the action method is
executed, the ViewResult is processed, and the output is injected into the response to the client.

Below is the example that explain how you can implement child Action

 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Web;  
 using System.Web.Mvc;  
 namespace child_Action.Controllers  
 {  
   public class ChildActionController : Controller  
   {  
     //  
     // GET: /ChildAction/  
     public ActionResult Index()  
     {  
       return View();  
     }  
     public ActionResult ChildActionDemo()  
     {  
       return View();  
     }  
     [ChildActionOnly]  
     public ActionResult Time()  
     {  
       return PartialView(DateTime.Now);  
     }  
   }  
 }  
 --------------------------------------------------------------------------------------------------------------  
 View -> ChildAction->ChildActionDemo  
 @{  
 ViewBag.Title = "Child Action Demonstration";  
 }  
 <p>This is the method rendered by the action method</p>  
 @Html.Action("Time")  
 <p>This is the method rendered by the action method again</p>  
 --------------------------------------------------------------------------------------------------------------  
 Partial View: Shared->Time  
 @model DateTime  
 <p>The time is: @Model.ToShortTimeString()</p>

Runtime Scaffolding

2012-05-16T15:06:00.000+05:30

In this post i will explain what is Runtime Scaffolding.
Runtime Scaffolding means generating the structure of the view at the runtime based on the models. There are three type of Runtime Scaffolding

DisplayForModel Html.DisplayForModel() Renders a read-only view of the entire model object
EditorForModel Html.EditorForModel() Renders editor elements for the entire model object
LabelForModel Html.LabelForModel() Renders an HTML <label> element referring to the entire model object

Bellow is the example which explains how you can use Runtime Scaffolding

 Create ProductModel  
 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Web;  
 namespace Test1.Models  
 {  
   public class Product  
   {  
     public string Name { get; set; }  
     public string Category { get; set; }  
     public decimal Price { get; set; }  
   }  
 }  
 -------------------------------------------------------------------------------------------------------------  
 Create Controller RuntimeScaffoldingController   
 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Web;  
 using System.Web.Mvc;  
 namespace MVC_Grid_Chart.Controllers  
 {  
   public class RuntimeScaffoldingController : Controller  
   {  
     //  
     // GET: /RuntimeScaffolding/  
     public ActionResult RuntimeScaffolding()  
     {  
       return View();  
     }  
   }  
 }  
 -------------------------------------------------------------------------------------------------------------  
 Create A view  
 @model Test1.Models.Product  
 @{  
   ViewBag.Title = "RuntimeScaffolding";  
 }  
 <h2>RuntimeScaffolding</h2>  
 @Html.EditorForModel()  
 ----------------------------------------------------------------------------------------------------------  
 As i have used @Html.EditorForModel() this will desplay the editing option at runtime, In the similar way you can use  
 Html.DisplayForModel()  
 Html.LabelForModel()

Output: