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:


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:

Troubleshooting your ASP.NET Environment to Run AJAX in IIS 7.5


After you have created that ASP.NET website of yours and are ready to deploy it on your server (home, company or hosting), you may soon realize that you cannot run any of the AJAX examples (especially in Chrome browser) without using a web server like IIS. You may also require some additional configuration in IIS to run ASP.NET code.

Follow these steps to make sure that you set up your Environment appropriately to run ASP.NET websites on IIS. I am using IIS 7.5 on a Windows 7 machine with Visual Studio 2012. The same process will work even for Visual Studio 2010 with ASP.NET 4.0.

Step 1: The first step is to make sure IIS is installed on your machine. Go to the Control Panel\Programs\Programs and Features and click ‘Turn Windows Features on or off’. This brings up a Windows Features list. Check the ‘Internet Information Services’ checkbox if it is unchecked

HTML5 Picture Element for Responsive Images


In this article, we will look at the <picture> element and how it helps in responsive design to render images of different sizes, based on the physical device accessing the content.

To display an image in our HTML pages, we have so far made use of the <img/> element with the source [src] attribute. Here’s an example:

<img src="Images/default.png" alt="Default Logo" />

With varying screen sizes and pixels, handling this image becomes a challenge. Let's create a small example for demonstrating this. I am using the free Visual Studio Community Edition although you can use any other web editor of your choice. Create an empty web application and add a HTML page with the name TestPicture.html in our project. Add the following code:

C# : Cannot implement an interface member because it is not public


If you've written a class that has implemented an interface, you've probably encountered the requirement where a method you are implementing, must be public. The error throw is usually “Cannot implement an interface member because it is not public”.

By default if an interface member method is implemented in your class without an access modifier, it is by default private.

But methods have to be public so that they can be called through the interface or they need to be explicit. Let us assume your interface is implemented as follows:

public interface ITest 
bool IsTest();

To change the visibility, you can either change the interface from public to internal.

Validate a Form using jQuery and Bootstrap Validator


One of the typical tasks when developing a web site is building a form to accept information, feedback or comments from visitors. But before submitting the form, it becomes necessary for us to validate user input before submitting the data to the server. You can validate phone numbers, emails, addresses, dates, credit cards etc. depending on your requirements.

In this article, I will show you a simple way to validate a form. For this purpose, we will use a plugin called Bootstrap Validator (project on ).

This plugin is based on Twitter Bootstrap.js and offers some great and expanding list of features. Some of them are:
  • Bootstrap UI and web-fonts integration
  • Validator initialization based on plugin options or HTML data-attribute
  • Some built-in fields validators like: length of the content, date, credit card, IBAN, IMEI, phone, and some others
  • Custom fields validators
  • Possibility to add multiple validators to each field
  • Possibility to show a feedback icon on the field after its validation
  • Possibility to show the validation messages in a specific HTML element
  • Rich API’s to manipulate the plugin instance and behaviors
  • Some supported languages for localization

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

Web API 2.0 – Attribute Routing


Web API routing has been pretty flexible using the convention based routing and custom Route Templates. We could specify custom routes, but things got verbose and disconnected for situations where we had to define routes for sub-resources, like for example if you had a list of Books and each book had more than one author, to fetch the authors for a book, you might want a route like http://myapp/api/books/{id}/authors

To do this, we had to define a route in the Route Table as follows

    name: “AuthorsForBook”,
    routeTemplate: “api/books/{id}/authors”,
    defaults: new { controller = “books”, action=“GetBookAuthors” }

Now this works but if we wanted another one, say for a list of Authors, select an author and then the books they have authored, the URL would be http://myapp/api/authors/{id}/books

Using jQuery Mobile in ASP.NET MVC 4


This article is from our ASP.NET MVC 101 Tutorial Series

ASP.NET MVC 4 introduced a Mobile Site template that leverages the jQuery Mobile to serve up views tailored for consumption on Mobile devices. Even though the latest ASP.NET site templates have responsive CSS, the mobile views aren’t particularly suited for data intensive views. It would be better if we had views dedicated to handle smaller mobile screens and be mindful of touch based navigation.

You can either create a brand new site specifically targeted for Mobile (if you are starting a green-field project) or you can add Mobile views to an existing MVC project with advanced features like view switching between Mobile and Desktop views.

Today, we are going to look at building a Mobile site ground up, so we’ll start with the mobile site template in Visual Studio

Copyright © 2009-2014 All Rights Reserved for by Suprotim Agarwal | Terms and Conditions