Now running on MVC4 with some other cool features

I upgraded the site on to MVC4 beta. It was not too bad. MVC3 and MVC4 can live together. I just followed the instructions on:

MVC4 White paper on ASP.net


I use web deploy. I made “the copy local = true” for the new dlls in order to get them copied over to hosting server.

I got my partial view for the links loading asynchronously. Here’s how I did it:
1)In links controller class I created a controller actions which returns partial view

public PartialViewResult LinksPartial()

{

return PartialView(db.Links.ToList());

}

2. Then I created a partial view as follows

You can make it strongly typed if you want to take advantage of scaffolding.
3) I made sure it works as follows:
http://localhost:(myportnumber) /Links/LinksPartial
4) After this, I created a div on the main page named it divLinks. This is where I wanted my links to load.
5) To load the links, I used jQuery’s load function. I added the code below at the bottom of the page to run it after the div is loaded.

$(document).ready(function () {
$('#divLinks').load("Links/MyPartialView", "", function linksEffect() {
//Your cool effects
});
});

That’s it! The links section is all Ajaxified!

Other feature added is syntax highlighter. Here’s how:

1. Opened NuGet

2. Searched for Syntax highlighter package. It installed all required the style sheets and JavaScript files

3. Added the following shared view page :

<link href="@Url.Content("~/Content/SyntaxHighlighter/shCore.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/SyntaxHighlighter/shThemeDefault.css")" rel="stylesheet" type="text/css" />
4) The package comes with bunch of other style. You can use them if you like but don’t remove the default two.
5) Added the JavaScript links

<script src="@Url.Content("~/Scripts/SyntaxHighlighter/shCore.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/SyntaxHighlighter/shBrushCSharp.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/SyntaxHighlighter/shBrushJScript.js")" type="text/javascript"></script>

6. At the bottom of the shared view page, added the call to script highlighter:

SyntaxHighlighter.all()

7. The syntax highlighter looks for
   . Wrapped the code as:

public class MyClass 
}

You can get more detailed instructions here:

Syntax Highlighter

Thanks to @natedudek for tips!