Remove Vertical Scrollbars in SyntaxHighlighter

SyntaxHighlighter created by Alex Gorbatchev is a code syntax highlighter developed in JavaScript. It basically makes your code snippets beautiful.

Many a times even when not required, a vertical scroll gets added to your code as shown here:

syntax-highlighter-scroll

The scroll appears in some browsers (especially Chrome) as the default style set in shCoreDefault.css is overflow: auto. If you do not want a vertical scrollbar, you can always do this:

ASP.NET Project Image Paths

I still see a lot of developers getting confused with the image paths in an ASP.NET application.

Here’s a very quick primer to help you with it:

Absolute Path

<img src="http://www.yourxyxwebsite.com/Images/SomeImage.jpg" />

Images folder in site root directory ("/")

<img src="/Images/SomeImage.jpg" />

Images folder in the current directory ("./")

<img src="./Images/SomeImage.jpg" />

./image.jpg and image.jpg are the same and refer to the current directory

Action Filters in ASP.NET MVC

Continuing with our MVC 101 series today we look at an important MVC feature, Filters. Filters in ASP.NET MVC are a way to apply cross-cutting logic at the controller level. Some examples of cross-cutting logic is Security and Logging.

Security is a cross cutting concern because, once enabled, we need to apply it for all incoming requests in the web Application. Imagine a world where you don’t have filters, in such case for every request that comes in, you Action method in controller will have to check if the user was Authorized to perform the action and view its result.

This not only violates single responsibility principle of the Action Method (it’s doing two things, evaluating security and computing the Action’s output) but is also an extremely verbose and repetitive work that we’ve to do irrespective of what the Action is supposed to do. Moreover, writing Authentication Code in action method cannot be guaranteed. There is no certainty that a developer may or may not miss out on implementing the code!

Login failed for user IIS APPPOOL\AppPool4.5 or APPPOOL\ASP.NET

The error ‘Login failed for user 'IIS APPPOOL\AppPool4.5’ usually occurs when you configure a new website in IIS or move an existing website to a newer version of IIS.

A simple solution to the error is to add a login to SQL Server for IIS APPPOOL\ASP.NET v4.5 and grant appropriate permission to the database.

Open SQL Server Management Studio > Right click ‘Security’ > New > Login

iis-apppool-login

Using Custom Directive in AngularJS to create reusable JavaScript components for your ASP.NET MVC app

In our previous three articles on Angular JS, we have seen how we could get started by building a small Twitter Client. We have explored the view model, Modules and Services in Angular JS and in our last article saw how to post data using the $resource Service.

Today we’ll see how to use a feature called Directives in Angular JS. Directives allow you to encapsulate custom behavior in an HTML element, attribute, classes and even comments. For example, the ng-app attribute that we use to define the scope of our Angular App is in fact a Directive, because there are no HTML5 attributes by that name! It’s Angular who interprets the attribute at runtime.

Apart from helping add custom attributes, directives can also be used to create the server side equivalent of ‘tag-libraries’ on the client. Those familiar with WebForms or JSP development will remember you could create server side components with custom Tags like <asp:GridView>…</asp:GridView> where the GridView rendering logic was encapsulated in a server component. Well, Directives allow you build such components, but on the client.

In fact today we’ll define a ‘Retweet’ button on our Tweet Reader that will enable us to encapsulate the function in a custom directive.

Angular JS: Routing to a SPA mode using ASP.NET MVC

In the beginning of the series I had mentioned that Single Page applications (SPA) were gaining popularity and that some of the ready SPA templates that come with ASP.NET MVC are rather opinionated, giving them a steep learning curve. We started with basics of Angular JS and slowly inched up learning bits of the framework. Till the third article we were mostly doing known things (data binding, templating, posting data) that other drop in libraries could do as well). The fourth article showed us how to do UI composition in form of directives and the seeds of a Single Page App were sown.

Today, we will look at routing (on the client side) and take the next step in realizing how a full blown Single Page Application framework functions.

Reading a Local File using HTML5 and JavaScript

One area where the web has lacked for some time is the lack of a true file system.  HTML5 fills this void by providing a standard way of interacting with local files using the FIle API specification.

These APIs are used to read file locally, handling images etc. Some of the specifications are as listed below:

1. File: Provides read-only information about the file like name, filesize, mimetype etc.

2. FileList: Represents an array of individually selected files from the local system

3. Blob: Represents the raw binary data and allows access to range of bytes within the data which can be used for slicing file

4. FileReader: Provides methods to read data from file or Blob

ASP.NET Web API 2.0 and the new OData keywords

Web API gained OData Support with the Visual Studio 2012 Update 2 release. However it was missing support for some keywords like $select, $expand and $batch. Today we’ll see how to setup our ASP.NET project to use Web API 2.0 beta binaries in Visual Studio 2012 Update 2 and use the new Keywords.

Setting up a WebAPI 2.0 project using Visual Studio 2012

Step 1: We start our project with a Visual Studio 2012 ASP.NET Project. Note that we use .NET Framework 4.5. This is because Web API 2.0 takes dependency of .NET Framework 4.5.

webapi-project-empty-new