NEW ADDITION TO VS 2013

NEW ADDITION TO VS 2013

ASP.NET APP SUSPENDED

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

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

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

1. 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.
2. Filter overrides: override filters specify a set of filter types that should not be run for a given scope [action or controller]
3. ASP.NET Identity for authentication and identity management
4. MVC template has been updated with Bootstrap to provide sleek and responsive  look and feel

MVC +WEBAPI +KendoUI Sample project

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

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?

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

•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

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

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

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

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

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

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

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