Recently I've been doing a lot of AJAX work, I'm preparing a presentation on best practices. I've also been helping some people at work who has been working on a very AJAX rich website.
One thing I've found a lot over the years is that people seem to get confused about the different between server and client and what can be done from one or the other.
And being web developers not understanding the differences can be a big issues. So I'm going to address some of the most commonly asked questions.
Why doesn't my JavaScript execute?
I can't count the number of times I've seen this code:
Page.ClientScript.RegisterStartupScript(this.GetType(), "js", "alert('hey!');", true); Response.Redirect("/some-page.aspx");
And had the developer ask "Why doesn't my JavaScript execute?".
*sigh*
This is an example of a developer not understanding the difference between client and server. Client code is not executed until every point of the server life cycle has completed, and then the client life cycle begins.
The client life cycle will vary depending on what (if any) JavaScript framework is being used.
With ASP.NET the server life cycle is always the same, information on it can be found here.
If you want to do a redirect after showing something in the client scope a window.location.href needs to be used. Something such as this is best:
Page.ClientScript.RegisterStartupScript(this.GetType(), "js", "alert('hey!');" setTimeout(2000, function() { window.location.href='https://www.aaron-powell.com/some-page.aspx'; });, true);
Why use a setTimeout? It means that the redirection is not automatic, so if you're showing something that wont pause page execusion (ie, not an alert) then it'll show your client info before redirecting.
Where do I put my client event handlers?
This is a point of conjecture, where do you put your client event handlers? Do you register them server side by adding them to the Attributes collection, do you add them to the markup of the server control or do you use your JavaScript framework to register an event handler?
I'm from the school of though which states "What happens on the client, stays on the client". My preference, using your JavaScript framework.
Why? Well I don't think that it can be expected that your UI developers, who are generally in charge of the JavaScript, need to dig around to find how all the client components come together.
Now it's starting to make sense that JavaScript shouldn't be in the .NET.
But how do you find the ASP.NET server control ID? ASP.NET generates its ID's on the fly.
$get('<%= myTextBox.ClientID %>');
Easy!
Or are you a jQuery fan?
$('#<%= myTextBox.ClientID %>');
Each framework has a different way in which events are attached, the Microsoft AJAX framework has its $addHandler, jQuery has .bind, etc.
Which JavaScript framework library should I use?
This is a massively subjective question it really comes down to what you are familiar with and what you want to do.
I'm a Microsoft AJAX and jQuery fan, especially since the past weeks announcement that Microsoft will be supporting jQuery along side their own framework (sweet!), I like the design pattern of Microsoft AJAX (which is built heavily on the prototype framework) but that comes back to being a .NET developer, I'm use to namespaces, classes and interfaces. All of which the MS framework brings in.
But jQuery is fantastic in animation, plugin library and an awesome set of selectors.
But this is because I've never played with mootools or the Yahoo! library, both of which I'm sure are great choices.
So hopefully these few common questions can be of reference or something you can point someone to next time they ask a question you can't be bothered answering.