Aradhye.com

Now running on MVC4 with some other cool features

Yogiraj Aradhye -

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());

}

  1. 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>

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

SyntaxHighlighter.all()

  1. The syntax highlighter looks for 
    . Wrapped the code as:
    2. 



public class MyClass 
}



You can get more detailed instructions here:


Syntax Highlighter


Thanks to @natedudek for tips!