Json.Stringify() not supported by Internet Explorer 8, Internet Explorer 9.

Today I was testing my ASP.NET MVC app I had prepared, with all browsers, when I run into this problem on Internet Explorer 9. I opened up the Internet Explorer Developer Tool and found an error message in the console. It read JSON is undefined.

After a little search, I came across this thread on stackoverflow. The solution to this was pretty simple.

Solution :

You only need to include a reference to json2.js to your project.

<script type='text/javascript' src='http://cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js'>
</script>

This json2.js file is present at http://cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js or https://github.com/douglascrockford/JSON-js/blob/master/json2.js, you can download this file and include this in your project.

This file creates a global JSON object containing two methods: stringify and parse.

Further Reading :

JSON.stringify and JSON.parse not working in IE9?

Is JSON.stringify() supported by IE 8?

How to collapse all items in Solution Explorer in Visual Studio with Resharper ?

Today I wanted to find, if Resharper provides a shortcut to ‘Collapse All’ items in the Solution Explorer? A little search on google led to this thread on JetBrain’s Dev Community.

As you can see in the screenshot below, there is an option called Collapse All and a shortcut key next to it.

Now this shortcut key will not work for you ! Unless you set it up using Tools > Options > Keyboard. The command name is CollapseInSolutionExplorerAction. Search using this command name and assign a shortcut key of your choice.

This made my life easier, I hope it does your’s too ;)

Further Reading :

Visual Studio: Is there a way to collapse all items of Solution Explorer?
JetBrain’s : Collapse All shortcut

How to disable resizing for textarea using plain CSS ?

The resize property allows a developer to define whether or not a UI element can be resized manually by the user.

Now suppose you have a textarea as shown below,

<textarea id="address">Some text</textarea>

you can disable resizing using the following css : (jsfiddle link / live demo)

#address{
    resize: none;
}

there are couple of more ways in which you could do the same as shown below…

textarea {
    resize: none;
}
textarea[name=address] {
    resize: none;
}
textarea[id=address] {
    resize: none;
}

Example / Demo :

Hope this helps :)

Further Reading :
How to disable resizable property of TextArea?
Disable textarea resizing for Safari and Chrome

Top 5 CSS Button Styling Tutorials and Techniques

One of my designer friend, recently shared with me his small experiment on buttons using CSS. Here is a direct link to the fiddle he shared. I hope someone finds this useful.

Please feel free to modify this fiddle and share your output with me, using the comment box. Cheers !

Html Code :

<p>
    <div class="google">Google Red</div>
</p>

<p>
    <div class="facebook">Facebook Blue</div>
</p>

<p>
    <div class="amazon">Amazon Yellow</div>
</p>

<p>
    <div class="windows">Windows Phone Red</div>
</p>

<p>
    <div class="nexus">Google Nexus</div>
</p>

CSS Code :

.google {
  width: 200px;
  background-color: #D14836;
  border: 1px solid #999;
  border-radius: 4px;
  padding: 10px;
  margin: 10px 5px;
  font-size: 12px;
  font-family: Arial;
  font-weight: bold;
  color: #fff;
  white-space: nowrap;
  display: block;
  text-align: center;
  cursor: pointer;
}
.facebook {
  width: 200px;
  background-color: #5B74A8;
  border: 1px solid #29447E;
  border-radius: 4px;
  padding: 10px;
  margin: 10px 5px;
  font-size: 12px;
  font-family: Arial;
  font-weight: bold;
  color: #fff;
  white-space: nowrap;
  display: block;
  text-align: center;
  cursor: pointer;
}
.amazon {
  width: 200px;
  background-color: #FECD57;
  border: 1px solid #FBC43C;
  border-radius: 4px;
  padding: 10px;
  margin: 10px 5px;
  font-size: 12px;
  font-family: Arial;
  font-weight: bold;
  color: #333;
  white-space: nowrap;
  display: block;
  text-align: center;
  cursor: pointer;
}
.windows {
  width: 200px;
  background-color: #E51400;
  border: 1px solid #E51400;
  border-radius: 4px;
  padding: 10px;
  margin: 10px 5px;
  font-size: 12px;
  font-family: Arial;
  font-weight: bold;
  color: #fff;
  white-space: nowrap;
  display: block;
  text-align: center;
  cursor: pointer;
}
.nexus {
  width: 200px;
  background-color: #4CADCB;
  border: 1px solid #02A9D6;
  border-radius: 4px;
  padding: 10px;
  margin: 10px 5px;
  font-size: 12px;
  font-family: Arial;
  font-weight: bold;
  color: #fff;
  white-space: nowrap;
  display: block;
  text-align: center;
  cursor: pointer;
}

Further Reading :
CSS Button Styling Tutorials and Techniques

How to show different Wallpapers when using Dual Monitors with Windows 7 ?

If you’re into Software Development, you probably must be having a multi-monitor setup in your office or home, right? I currently use dual monitors at my office. One thing which I have been trying to do ever since I had this setup, was to show different wallpapers on each screen.

After a little googling I found out that, Windows 7 does not provide this feature. There are plenty of 3rd party softwares which when installed allows you to set different wallpapers and do much much more. Few of these software which I know are DisplayFusion, Ultramon, Samurize and the list goes on…

Enter DisplayFusion !

DisplayFusion will make your multi-monitor life much easier. With powerful features like Multi-Monitor Taskbars, TitleBar Buttons and fully customizable Functions, DisplayFusion will make managing your multiple monitors easy. Take a look at some of the features below to learn how DisplayFusion can help you!

I have been using DisplayFusion for over a month now… and I have no complaints yet. Hope this help you too :)

Douglas Crockford ‘s Javascript Video Collection : The Complete Series

Douglas Crockford is an American computer programmer and entrepreneur who is best known for his ongoing involvement in the development of the JavaScript language, for having popularized the data format JSON (JavaScript Object Notation), and for developing various JavaScript related tools such as JSLint and JSMin.

Chapter 1: The Early Years

Chapter 2: And Then There Was JavaScript

Chapter 3: Function the Ultimate

Chapter 4: The Metamorphosis of Ajax

Chapter 5: The End of All Things

Further Reading :
15 Essential JavaScript Video Tutorials
http://yuiblog.com/crockford/

How to set Culture in ASP.NET Web API ?

There are three ways to set the Culture information in any ASP.NET Web Api application : 1. Application Level 2. Page Level 3. Thread Level

1.Application Level:

<configuration> <system.web> <globalization culture="en-GB" uiCulture="en-GB"/> </system.web> </configuration>

2.Page Level:

@{ Culture = "en-GB"; UICulture = "en-GB"; }

// if using aspx, then..

<%@Page Culture="en-GB" Language="C#" %>

3.Thread Level:

Thread.CurrentThread.CurrentCulture = new CultureInfo("en-GB");

Hope this helps you :)

Clear, a popular iphone todo app, now for Android !

Clear is a minimalist iphone only to-do list app with an engaging touch interface: Swipe, pull, and pinch to work with your tasks. Tasks are color-coded in a heat map so you know which are the most pressing.

Pull down to create a task, swipe to complete it, and pinch to change to a different list. That’s it.

Unfortunately Clear does not have an Android app. However, a near perfect clone of Clear has been released for Android. This app goes by the name of koalcat’s Clear, this app is free and can be downloaded from android market(link).

I have been using this app for quite a while, below are some screenshots from my android :=)

Hope this helps :)

Which is the best iPhone Theme For Your Android Phone

There are plenty of iPhone themes out there for Android, but not all of them are very good. Some of them rely on you buying a home launcher application as well, which leaves you out in the cold.

Well there is one such app that I have been using for over a year now, and I am simply in love with it !

It goes by the name of Espier Launcher(2.1) developed by Espier Studio.

Espier Launcher is a free download for Android 1.5 and up. Below are few screenshot I took from my mobile.

I hope your search for an Iphone theme for android ends here :) Cheers !

Update : This app also got featured in one of the articles at lifehacker.com : Espier Launcher Makes Your Android Phone Look Just Like iOS

How to make StackOverflow like message box using CSS and Jquery ?

I have always been a fan of stackoverflow’s message box, so today I decided to re-create and share a similar message box just for fun ! Below is how stackoverflow’s message box looks like…

Below is what I have come up with at… http://jsfiddle.net/yrshaikh/HpYDX/

Html code :

<div class="error-box" style="display: block; ">
</div>​

Javascript code :

$(".error-box").append("<p>Some Random Message inside the box.</p>" + "<span>(click on this box to dismiss)</span>" );
$(".error-box").bind("click", function(){
$(".error-box").hide();
});​

CSS code :

.error-box {
    z-index: 1;
    cursor: pointer;
    display: none;
    position: absolute;
    padding: 15px;
    -moz-box-shadow: 2px 2px 5px #000000;
    -webkit-box-shadow: 2px 2px 5px black;
    box-shadow: 2px 2px 5px black;
    color: #333 !important;
    font-weight:bold;
    background-color: #E3E3E3 !important;
    font-family:Segoe UI;
    text-align:center;
}​

Hope this helps :) I would love to hear your feedback and suggestions, please use the comment section for this.