I have been a huge fan of jQuery ever since I started working on IdeaPipe about 10 months ago. Mostly because of its simplistic DOM access using standard CSS syntax that we all have to learn anyways in the modern Web 2.0 world. In addition to the ease of finding elements on your page, it also works very nicely with other frameworks, I have used it in combination with Microsoft AJAX, Google’s GData JavaScript, and TinyMCE.

Personally I found this to be amazing news, because Microsoft is shipping an Open Source project, licensed under MIT License, with its flag ship developer tool, Visual Studio.  Maybe if we play our cards right, we can start seeing other projects like NUnit and Moq start to ship with Visual Studio.  I have my fingers crossed.

John Resig the developer of jQuery had this to say on his blog:

Microsoft is looking to make jQuery part of their official development platform. Their JavaScript offering today includes the ASP.NET Ajax Framework and they’re looking to expand it with the use of jQuery. This means that jQuery will be distributed with Visual Studio (which will include jQuery intellisense, snippets, examples, and documentation).

And according to Scott Guthrie, Microsoft is also extending the standard product support to jQuery:

We will also extend Microsoft product support to jQuery beginning later this year, which will enable developers and enterprises to call and open jQuery support cases 24×7 with Microsoft PSS.

This is probably some of the most exciting, because it means that jQuery will be a supported stack in some of the more rigid enterprise development environments that won’t install anything that isn’t supported by Microsoft.  I also beleive this is great news for MVC, because jQuery makes MVC just that much more useful for the average developer.

Tags: jQuery, MVC, Visual Studio

Posted in News | | | View blog reactions | No Comments »

Today I had the need to create a custom event using jQuery, in order to launch a customized form validation event from a global submit event. I did this so I could focus in on the first form field that had an error. My event from the global.js script, that is included on every page of IdeaPipe, looks like this:

$("form").submit(function () {
	var valid = $(this).validate();

	// if the form didn't validate then focus the input on the first error
	if (!valid)
		$(this).find(":input[error]:first").focus();

	return valid;
});

This is pretty standard jQuery. What this code above does is set a custom function for the submit event for any <form /> tag on the page. The submit event will only be allowed to continue if a return value of true is returned from the function.

I was able to create this custom jQuery event with the following code:

jQuery.fn.extend({
	validate: function (fn) {
		if (fn) {
			return jQuery.event.add(this[0], "validate", fn, null);
		} else {
			var ret = jQuery.event.trigger("validate", null, this[0], false, null);

			// if there was no return value then the even validated correctly
			if (ret === undefined)
				ret = true;

			return ret;
		}
	}
});

There are two different states to this method. Primarily because in JavaScript all parameters are optional for functions. So the two states of this function are:

• validate(fn) - sets the event
• validate() - fires the event

An example of setting the event is:

$("form.user-login").validate(function () {
	var userNameValid = ValidateLoginUserName();
	var passwordValid = ValidateLoginPassword();

	return userNameValid && passwordValid;
});

In this example the form is valid if both the login user name and password validate.

An example of using the event is the same as the method above.

$("form").submit(function () {
	var valid = $(this).validate();
	// do some stuff
	return valid;
});

This may not be the standard bind() and trigger() that most jQuery programmers are use to, but I needed an event that would return a value of true or false, so that I my submit event handler knows if it should focus on errors or continue the submit process.

Hope everybody finds this useful.

Tags: IdeaPipe, JavaScript, jQuery

Posted in How To, JavaScript | | | View blog reactions | 1 Comment »

There is a simple way to tell if you can use MVC in your web application.  If any of the following are true, you probably shouldn’t:

1. You require the ViewState
   This includes any 3rd party control…  Quick way to check this is disable ViewState and check to see if you application works as expected.
2. You require post backs
   This usually is required by Web Forms or Microsoft AJAX Toolkit…  Fortunately most of the post back functionality can be duplicated on the client side with AJAX.  I fine jQuery makes a real easy job of this.

So that is all that you need to ask your self when thinking of upgrading or deciding which route to take when planning your new application.

Tags: AJAX, ASP.NET, jQuery, MVC, ViewState

Posted in ASP.NET, Programming | | | View blog reactions | No Comments »