Web-developers can create amazing web-applications with AJAX. Stikkit, Netvibes, GMail and dozens of further web-projects offer a new level of interactivity we’ve used to give up the idea of. Modern web-applications can be designed with enhanced user interfaces and functionalities, which used to be the privelege of professional desktop-applications. AJAX makes it possible to create more interactive, more responsive and more flexible web-solutions. And it’s the first step towards rich internet applications of the future.
Asynchronous JavaScript and XML isn’t a new programming language, as it is often mistakingly called. Basically, AJAX is a set of XHTML, CSS, DOM, XMLHttpRequest and XML, put together and used together for the same purpose – to improve the user-server-interaction.
- To understand the idea behind AJAX, you should read Jesse James Garrett’s article “Ajax: A New Approach to Web Applications” and Wikipedia: Ajax;
- to learn the basics of AJAX, you should go through some AJAX tutorials we’ve presented previously;
- to learn more about professional CSS coding, you should visit 70 Expert Ideas For Better CSS Coding;
- and to get a powerful and handy CSS-Toolbox for your future projects, you can use 53 CSS-Techniques You Couldn’t Live Without.
In this article we’d like to present a list of over 90 useful AJAX-based techniques you should always have ready to hand developing AJAX-based web-applications. Auto-completion, instant field editing, menus, calendars, interactive elements, visual effects, animation, basic javascripts, as well as an extensive developer’s suite should give you a useful and powerful toolbox you can use every day, without a need to go through hundreds of AJAX-related bookmarks.
You may also want to take a look at the article 60 More Ajax and Javascript Solutions For Professional Coding.
AJAX Auto Completer
1. AJAX AutoSuggest: An AJAX auto-complete text field
2. AJAX Autocompleter / script.aculo.us library
4. Ajax autosuggest/autocomplete from database
AJAX Instant Edit
7. AJAX & CSS Flickr-like Editing Fields
AJAX Menus, Tabs
9. 14 Tab-Based Interface Techniques
10. AJAX Menu Widget
11. AJAX Accordion Navigation: mootools demos
12. AJAX Dialogs, Menus, Grids, Trees and Views
13. AJAX Tab Module – Closeable Implementation
15. AJAX Tabbed Content
16. MooTabs – Tiny tab class for MooTools
17. Dynamically loaded articles
AJAX Date, Time, Calendars
18. AJAX Datetime Toolbocks – Intuitive Date Input Selection
19. AJAX Calendars
AJAX Interactive Elements
22. Ajax poller
AJAX Developer’s Suite
23. AJAX HistoryManager, Pagination
26. AJAX Tooltips: Nice Titles revised | Blog | 1976design.com
27. 40+ Tooltips Scripts With AJAX, JavaScript & CSS | Smashing Magazine
30. GMail Ajax Style Username Signup
31. Gmail Ajax Style Check Username
33. ModalBox — An easy way to create popups and wizards
34. AJAX File Uploads progress bar
36. Fly to basket
38. Disable form submit on enter keypress
Enhanced AJAX Solutions
39. AJAX Instant Completion: Rico Framework
41. Altering CSS Class Attributes with JavaScript
42. Select Some Checkboxes JavaScript Function
43. AJAX Emprise Charts: 100% Pure JavaScript Charts
44. amCharts: customizable flash Pie & Donut chart
45. PJ Hyett : The Lightbox Effect without Lightbox
Ajax Forms
46. AJAX Upload Form
49. Ajax.Form: mootools demo
51. Really easy field validation
52. AJAX fValidate: a high quality javascript form validation tool
54. wForms: A Javascript Extension to Web Forms – The Form Assembly
AJAX Grids, Tables
55. Data Grids with AJAX, DHTML and JavaScript | Smashing Magazine
56. Grid3 Example
57. AJAX Table Sort Script (revisited)
58. AJAX Sortable Tables: from Scratch with MochiKit
59. AJAX TableKit
AJAX Lightboxes, Galleries, Showcases
60. 30 Scripts For Galleries, Slideshows and Lightboxes | Smashing Magazine
61. AJAX LightBox, Sexy Box, Thick Box
62. AJAX Lightbox JS
63. AJAX Unobtrusive Popup – GreyBox
64. SmoothGallery: Mootools Mojo for Images | Full gallery
65. AJAX Libraries and Frameworks
Visual Effects, Animation
66. How to Create Digg Comment Style Sliding DIVs with Javascript and CSS
67. How to Create a Collapsible DIV with Javascript and CSS
68. How to Create an Animated, Sliding, Collapsible DIV with Javascript and CSS
69. AJAX Shopcart
72. AJAX Pull Down Effect: Rico Framework
73. AJAX Animation Effects: Rico Framework
74. Combination Effects in scriptaculous wiki
75. AJAX Motion Transition: Fx.Morph
Useful Basic JavaScripts
76. 9 Javascript(s) you better not miss !!
77. Top 10 custom JavaScript functions of all time
78. Hyperdisc Materials: JavaScript: Top 10: Automatic Breadcrumb Trail
79. JavaScript: Top 10 Most Useful JavaScripts
80. My Favorite Javascripts for Designers: Blakems.com ?
Galleries, Resources
81. MiniAjax.com: a showroom of nice looking simple downloadable DHTML and AJAX scripts.
82. Ajax Rain: growing showcase of AJAX-examples.
83. Max Kiesler – mHub : Ajax and rails examples & how-to’s
84. Ajax Resources
85. DZone Snippets: Store, sort and share source code, with tag goodness
credits to : http://www.smashingmagazine.com