jQuery

I've been looking at using Javascript libraries recently, in order to revamp Lesley's site there are a lot out there (Prototype, Mootools, scriptaculous, Dojo, YUI). I've decided to use JQuery as it appears to have the largest following, which means more support, tutorials and extra plugins. It's also easily extensible meaning you can customise and extend.

What is it? "jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript." In short, you can get Flash-type effects and general all-round sexiness using only javascript, could be used for cool menus, client side table sorting, tabs, AJAX data/image loading, page manipulation, custom dialog boxes, charts etc.

To use you need some understanding of CSS as it uses CSS-style selectors ("li", "#Id", ".class", "a>img" etc) to access elements using jQuery and it appears a lot of the functionality uses CSS to move/position elements.

Here are some good links that I've found:

• Main Site


• Documentation incl. lots of links


• Tutorials


• Beginners video tutorial


• Modal Demo


• Tabs Demo


• Menu Demo


• Charts Demo


• File Tree Demo


• Sortable Table Demo


• Photo Slider Demo


• Virtual Tour Demo (Outrageous)

Modal Popup in IE

To have a web page popup in a modal page IE has a javascript function

window.showModalDialog('page url', 'page title', 'options');

The syntax for the options is slightly different from window.open

To specify height and width we would do:

'dialogHeight:300px; dialogWidth:300px'

To make sure the code works cross browser we can check for the showModalDialog function and if it is not available we can you use window.open.

eg.

if (window.showModalDialog)
{
window.showModalDialog('page.html','MyPage','dialogWidth:300px;dialogHeight:3000px');
}else{
window.open('page.html','MyPage','width=300, height=300');
}

Add a confirm popup in asp .net

To add a confirm popup when a button is clicked in asp .net do the following:

In the buttons OnClientClick add the following javascript:

if(confirm('Are you sure?'))
{
return true;
}else{
return false;
}

The confirm method returns a boolean.

The popup displays the message, an Ok button and a canel button.

If Ok is clicked return true allows the button to cause a post back.
Clicking cancel returns false cancel the submit action of the button.