Archives for January 2014

Reasons Developers Should Learn Angular

Angular is without a doubt, a self-proclaimed “superheroic JavaScript Framework”. Angular Js is an open-source JavaScript framework that is maintained by Google. It assists with running SPA or Single Page Applications. The goal is to augment browser-based applications with MVC (Model-View-Controller) capability to make both development and testing easier.

There are 10 reasons web developers should learn how to use angular. It provides Data-Binding

Angular gets rid of Ritual and Ceremony.

Angular provides dependency injection.

It allows developers to express UI declaratively and reduce its side effects.

It embraces DD testing

Angular enables massive parallel development

It enables designer and developer workflow.

Read the rest of the reasons in this post:

How to Pass Multiple Models in ASP.NET MVC

In this article, we’ll provide you the best way to pass multiple models from controller to view in ASP.NET MVC. There are 6 approaches. The 6 approaches described in theis article have their pros and cons. What you pick will depend on a specific scenario in hand and it is obviously a debatable topic. Before taking any decision, you need to identify your exact requirements then before choosing one, compare its pros and cons.

  1. Partial View
  2. ViewModel
  3. ViewData
  4. ViewBag
  5. TempData
  6. Tuple

Take note that an application can use more than one approach based on the requirement  and at a particular point. However, we need to consider the best one in need.

Read the rest of the post here:

ASP.NET JQuery Template Grid with Paging, Sorting, and Ajax Method Invocation

A traditional ASP.NET GridView control is a web server control that renders or runtime at web server. It occupies more memory and CPU utilization. To provide a better web responsive application experience, JQuery Template Grid is your solution.

JQuery Template Grid is a client-side grid mechanism that occupies the needed memory at client side and your web server is freed up from the memory overheads. It entertains just the Data Acquisition and manipulation code.

This provides more control over the user interface as it has a more robust data fetching and displaying mechanisms in a grid. It is also flexible to cater design issues.

Read the rest of the tutorial here:

Create HTML Helpers Extension Method to Get ID and Name

In this article, we’ll show the two extensions of HTMLHelper class, the ID in Jquery Function and the name in JQuery Function. You can create a strongly-typed view then field ID and name are automatically created. This is because the property name is bound with an Id or Name in a JavaScript function. This article will also provide a solution for that hard-coded string. You can use an HTML Helper extension method in JavaScript/Jquery function which takes the same model property as taken by the input field.

If you want to learn more about this extension, please visit this page:

How to Return More Views in ASP.NET MVC Action

If you want to build a complex UI but don’t want to build a complicated client-side code, all you have to do is minimize the amount of JavaScript code to render the HTML content on the server-side. Then create a new ActionResult class in which it allows an ASP.NET MVC application to update more unrelated parts of the HTML DOM, in a single request-response roundtrip. As a result, it will render more partial views on the client side. That is why it is called, MultipartialResult.

The concept of MultiPartial is very simple. It is inherited from JsonResult class, and it renders the specified elements into Strings, collect strings, and packs them into a json data and sends it to the client side.


Read the rest of the tutorial here:

Introduction to ASP.NET MVC Model Binding

In this article, we’ll try to understand what ASP.NET MVC Model Binding is. We will look into some code samples to understand Model Binding and why it is useful for ASP.NET MVC application development.

When developers just started using ASP.NET MVC, they often ask this question: “How the values from HTML for(view) gets converted to the Model class when it reaches the Action method of the Controller class?”.

This magic is being done by ASP.NET model binder. What it does it it takes the values coming from an HTML page and map it to the corresponding model. This feature relieves the developers from writing all the type casting and HTML-Model mapping code.


Read the rest of the tutorial here:

Server-Side Validation in ASP.NET MVC

In this article, we’ll explain the basics of ASP.NET MVC server-side validation using the Data Annotation API. The ASP.NET MVC framework will validate any data passed into the controller action that it is executing. It will populate the ModelState object with any validation failure that it can find then pass the object to the controller.

This tutorial will use two approaches to validate a model date. One is manually adding an error to the ModelState, the other is to use Data Annotation API to validate the model data.

Read the rest of the post here:


Simple ASP.NET Web API Project That Implements IoC/DI using Castle Windsor

DI or Dependency Injection is a way to write an interface rather than an implementation – IOW, code to an interface or abstraction rather than a concrete implementation. It allows for extensibility and you are not locked in to a particular class. DI is closely related to Inversion of Control(IoC). Instead of a class instantiating a concrete class, it uses a constructor that takes the interfce type a s an argument, and the concrete  calss implements that interface is passed to it.

To give you a rundown on what code needs to be added to the WebAPI, here we’ll enumerate the basic process.

Read the rest of the post here:

How to Properly Layout a Page with HTML5

A web page that is being renders consists of a lot of things like logo, text, pictures, hyperlinks, navigation structure, etc. HTML5 offers a set of markup elements that allow you to create a structured layout for web pages. These pages are often referred to as Semantic Markup.

Semantic Markup expresses its meaning an purpose to the developers and the browser developers. This article will cover semantic markup elements of HTML5 which can be used to properly layout web pages. Unlike the conventional <div> element, symantic elemens are used for specific purposes. These elements are <header>,<nav>,<section>,<footer>, <article>, and <aside>.


Read the rest of the tutorial here:

Build SPA using Angular JS

If you want to build a SPA (Single Page Application) while depending on a solid JavaScript framework, then this article is for you. Before discussing what is needed to build SPA using Angular JS, here is a demo application using a solid JS framework and Angular JS.


Here are some reasons why you’ll have to use Angular:

Two-way building. AngularJS templating engine binds data in two-way. Which means it will automagically synchronize data between the view and the model. If you updated the view, you also updated the model and vice versa.

Models are POJO. Data models in Angular JS are just “Plain Old Javascript Objets. Any changes done on the view are immediately pushed back to the model.


Read the rest of the post here: