Friday, 6 December 2013

Working with twitter bootstrap in Asp.Net MVC4

At time when i was struggling in my project for UI development my manager told me about this great thing. At start i found it little difficult to work with but later when i got to know about its huge benefits and swiftness i became a fan of it. I was like "Oh, we can make complete project out from it.".

What really twitter bootstrap is who made it and why, all these questions i will answer here only.
2 Designers from twitter (Mark Otto and Jacob Thornton) actually made it now its an open source project hosted on github.

For MVC projects you directly have to install the 2 NuGet packages. They are:
  1. twitter.bootstrap.mvc4
  2. twitter.bootstrap.mvc4.htmlhelpers
Actually you have one more option of installing the samples that those guys have made. For that you have to install a separate package:  twitter.bootstrap.samples.mvc4

Once through with all this you can continue with creating Models, Controllers, Generating Views or Creating Views in your project. All the Views will use Bootstrap Layout for Textboxes, Checkboxes. But for buttons you have to apply the class seprately.
Following are some examples of controls with bootstrap styling.
For getting more out of the Bootstrap you seriously need to know about all the style elements which you can get a good understanding from the following link:

I hope that this article will help you in using Twitter bootstrap for MVC4.
For any queries write comment.

Distinct Keyword in LINQ

Few days back when I was trying to Filter my result set using Linq Distinct keyword I got into a situation. The keyword didn't worked for me, I was getting same result set with or without Linq.

I Goggled for the solution, But most of the solutions offered to user the Group By operator. which is as follows:

Take an entity that contains following fields:
id, Name.
public class MyDemo

public int id{get; set;};

public string Name {get; set;};

MyDemo ListData = new MyDemo
id=1, Name="Alpha";
id=2, Name="Beta";
id=1, Name="Alpha";
id=3, Name="Gamma";
MyDemo ListResult;

ListResult = (ListData.Select(t => t).GroupBy(x => x.Name).Select(y => y.First()).ToList()

Distinct Keyword is little tricky in Linq. At first it would not work same like Distinct in sql server Linq to Object behaves little weird because all are distinct object references so the other way round to this problem is use a GroupBy Operator.

We can get the solution to this problem by introducing an anonymous type to store the result and in that case we will get the desired result.

var result =  (from d in ListData select new {, d.Name }).Distinct();

Thursday, 10 October 2013

Working with DropDownLists in MVC

Drop down list in mvc is quiet different from drop down list control in web forms.

The reason being the Drop down list control in web form is so brilliant that whatever collection we give to it, it will take it quietly and do all the hard work from its side.

But in MVC scenario is little different. Here Drop Down List Helper takes only List<SelectListItem>.

So This is a class added for storing drop down list values. It is under System.Web.Mvc namespace
It has 3 Properties: Name, Value, Selected.
Selected is bool and rest two are string type.

There are 2 types of data you can fill Dropdown list with:
1) InMemory collection.
2) From Database.

For InMemory Collection you have to create a list of 
either in View or in controller( later pass it to view).
This is how you can create it in controller.

Same can be done in View also. But Then passing data to view from Controller will not be true in that case as you are preparing the data in view itself.

From Database
While selecting the data from database you can directly convert the data to List of SelectListItem.

If you want you view to Generate Dropdownlist for you the you have create a propery with List<SelectListItem> in your Model.
public List<SelectListItem> MyDropDownList { get; set; }

But while submitting the page it will not give you SelectList Item. Instead Drop down list will return a simple string value just like Textbox.

I hope this is enough for start working with Drop down list.
For any queries comment below.

Monday, 22 July 2013

Working with PartialViews in MVC4

Hi, Its not been a long time for me to started working with MVC. What I saw is that lot of developers find it difficult to start with Partial views.
For those who are coming from the background of Web Form it is not at all difficult to compare it with Web User Controls. Just like we can display the User Control on any page we want by Registering the control, Same way we can use the Partial View in MVC.

Here in this post i will be following 2 steps, First will be creating Partial Views and Second will be calling that Partial View in View.

Lets start with the First step:

Creating a Partial View

Partial View can be created by following ways:

First: By Right clicking on Views folder in which you want to create the view.

After this step one PopUp will appear for asking you if you want to create the View as Strongly typed.
In that popup one checkbox will be there for Partial View.

Second: By using Add New Item option

Note: Using this Second option you will not get the option for creating the view as partial view.

After this we will get a blank page and we can put any HTML content we want in Partial View.
I am displaying some RAW content.

Calling a Partial View

For calling a partial view you can use two methods.
          1. @Html.Partial(string Viewname)

This returns a string, means you can store the output of this into any variable also Or return it from function.

          2. Html.RenderPartial(string Viewname)
This internally returns Void. Result is written directly to Response stream during the execution.

Using in Razor and Aspx:

Razor Syntax:


Aspx Syntax:

<%: Html.Partial("ViewName") %>

<% Html.RenderPartial("ViewName"); %>

PS: Partial Views can also be created as Strong Views.

Saturday, 23 March 2013

Working with Videos in Grid View Control

One of my friend asked me how do you manage videos in your Asp.Net page. In first shot i said "HTML5". After that one asked me how to display video in GridView Control.
Believe me firstly i was confused about it then i thought about what can we do inside item template to display the videos in our grid. Then first answer came to my mind (HTML5) and i was like "Oh man!!".

This post have no complicated code in it to understand. One simple grid view and Simple HTML5 video tag.
Lets start doing it:

  • Place a gridview control on your page.
  • Add all the fields from database (Here i am assuming that you are saving link to videos in your database).
  • Use what ever field you want to use for your data (Bound field/Checkbox field etc) but for video column you have to take the ItemTemplate only.

  • Bind data to your grid. and its done.

P.S. : 

  1. Please Note that HTML5 tags don't work in every browser.
  2. In my case I m using Chrome25.
  3. Its not working in Firefox 13.
  4. For saving video url's in database dont save them using (~/Videos...)
  5. Save directly as (Videos/video.mp4)
  6. Also its not necessary that every file format will run. I tried with wmv, it didnt worked.

Tuesday, 26 February 2013

Substitution Control in and calling method in .aspx page

Hi All, Today i was just glancing through the toolbox of Visual Studio, Suddenly a control came to my mind SUBSTITUTION control.

I thought to first write about this control only. Actually earlier i was planning to write about working with Nesting the GridView, But now it will be my next post..

So, This substitution control is so simple that people rarely talk about this control but it is very useful when it comes to Calling a function in your .aspx page when you have set some output cache for your page then it will help you for displaying the dynamic content on the cached page.

It is a simple solution for partial page caching for a page where most of the content is cached. In case of using this control in cached page the cached content will remain static until its cache expires but substitution control will fetch fresh data every time page is requested.

This control is basically used in pages which are cached and some part of the page needs to be updated frequently.

Lets have a look on how it works:

Simple One Line Declaration

In this line we are calling a method name DateTimeMethod delared in .aspx.cs file.

Method should meet the following criteria:

  • It should be static
  • It must accept a parameter of type HttpContext
  • It should return a string.

Best part of substitution control is that it doesnt render any markup. It will directly send the output as plain text.Other controls on page aren't accessible to Substitution control.

P.S.  Calling Csharp Methods Directly in aspx page:

One more point to note here is that we can achieve same behaviour by using script tag in aspx page. Example is as follows:

and best part of using this is we don't compulsorily have to use string as return type. We can take int or whatever we want. Given code will work absolutely fine.