Wednesday, June 20, 2007

Tools That Help You in Ajax Coding

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.

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.

AJAX Auto Completer

1. AJAX AutoSuggest: An AJAX auto-complete text field

AJAX Scripts - AutoSuggest: An AJAX auto-complete text field : CSS . XHTML . Javascript . DOM, Development : Brand Spanking New

2. AJAX Autocompleter / script.aculo.us library

AJAX Scripts - script.aculo.us - web 2.0 javascript demos

3. AJAX AutoCompleter

AJAX Scripts - digitarald.de » Playground - Widget Birthplace

4. Ajax autosuggest/autocomplete from database

AJAX Scripts - Ajax autosuggest/autocomplete from database

5. Ajax dynamic list

AJAX Scripts - Ajax dynamic list

AJAX Instant Edit

6. AJAX inline text edit 2.0

AJAX Scripts - YvoSchaap.com - Easy AJAX inline text edit 2.0

7. AJAX & CSS Flickr-like Editing Fields

AJAX Scripts - Create flickr-like Editing Fields Using AJAX & CSS » Dustin Bachrach Blog

8. AJAX Instant Edit

AJAX Scripts - xmlHttpRequest - Instant Edit

AJAX Menus, Tabs

9. 14 Tab-Based Interface Techniques

14 Tab-Based Interface Techniques

10. AJAX Menu Widget

AJAX Scripts - Comunidade brasileira da biblioteca EXTJS

11. AJAX Accordion Navigation: mootools demos

AJAX Scripts - mootools demos - Accordion

12. AJAX Dialogs, Menus, Grids, Trees and Views

AJAX Scripts - Comunidade brasileira da biblioteca EXTJS

13. AJAX Tab Module - Closeable Implementation

AJAX Scripts - Tab Module - Closeable Implementation

14. Ajax Tabs Content

AJAX Scripts - Dynamic Drive DHTML Scripts- Ajax Tabs Content script

15. AJAX Tabbed Content

AJAX Scripts - Ajax Lessons » Ajax Workshop 2: Building Tabbed Content

16. MooTabs - Tiny tab class for MooTools

AJAX Scripts - MooTabs - Tiny tab class for MooTools

17. Dynamically loaded articles

AJAX Scripts - Dynamically loaded articles

AJAX Date, Time, Calendars

18. AJAX Datetime Toolbocks - Intuitive Date Input Selection

AJAX Scripts - Datetime Toolbocks - Intuitive Date Input Selection

19. AJAX Calendars

AJAX Scripts - RibosoMatic » 10 calendarios con PHP, CSS y Javascript

AJAX Interactive Elements

20. AJAX Floating Windows

AJAX Scripts - Prototype Window Class : Introduction

21. AJAX Star Rating Bar

AJAX Scripts - Masuga Design » Unobtrusive AJAX Star Rating Bar

22. Ajax poller

AJAX Scripts - Ajax poller

AJAX Developer’s Suite

23. AJAX HistoryManager, Pagination

AJAX Scripts - digitarald » HistoryManager

24. AJAX Login System Demo

AJAX Scripts - AJAX Login System Demo

25. AJAX image preloader

AJAX Scripts - Javascript image preloader

26. AJAX Tooltips: Nice Titles revised | Blog | 1976design.com

AJAX Scripts - Nice Titles revised | Blog | 1976design.com

27. 40+ Tooltips Scripts With AJAX, JavaScript & CSS | Smashing Magazine

AJAX Scripts - 40+ Tooltips Scripts With AJAX, JavaScript & CSS | Smashing Magazine

28. AJAX Web Controls

AJAX Scripts - Pageproperties test page

29. AJAX syntaxhighlighter

AJAX Scripts - syntaxhighlighter - Google Code

30. GMail Ajax Style Username Signup

AJAX Scripts - Cyber Dummy - Web Developer

31. Gmail Ajax Style Check Username

AJAX Scripts - Gmail Style Check Username AJAX

32. Transparent Message

AJAX Scripts - Transparent Message

33. ModalBox — An easy way to create popups and wizards

AJAX Scripts - ModalBox — An easy way to create popups and wizards

34. AJAX File Uploads progress bar

AJAX Scripts - CakeTimer - Demo Page | An Ajax file uploads progress bar

35. Chained select boxes

AJAX Scripts - Chained select boxes

36. Fly to basket

AJAX Scripts - Fly to basket

37. AJAX Key Events Signal

AJAX Scripts - Signal Example

38. Disable form submit on enter keypress

AJAX Scripts - AS Workshop » Disable form submit on enter keypress

Enhanced AJAX Solutions

39. AJAX Instant Completion: Rico Framework

AJAX Scripts - Rico

40. Novemberborn: Event Cache

AJAX Scripts - Novemberborn: Event Cache

41. Altering CSS Class Attributes with JavaScript

AJAX Scripts - Altering CSS Class Attributes with JavaScript

42. Select Some Checkboxes JavaScript Function

AJAX Scripts - Select Some Checkboxes JavaScript Function

43. AJAX Emprise Charts: 100% Pure JavaScript Charts

AJAX Scripts - Emprise JavaScript Charts :: 100% Pure JavaScript Charts

44. amCharts: customizable flash Pie & Donut chart

AJAX Scripts - amCharts: customizable flash Pie & Donut chart

45. PJ Hyett : The Lightbox Effect without Lightbox

AJAX Scripts - PJ Hyett : The Lightbox Effect without Lightbox

Ajax Forms

46. AJAX Upload Form

AJAX Scripts - digitarald.de » Playground - Widget Birthplace

47. An AJAX contact form

AJAX Scripts - An AJAX contact form

48. AJAX contact form

AJAX Scripts - AJAX contact form

49. Ajax.Form: mootools demo

AJAX Scripts - mootools demos - Ajax.Form

50. Ajax form validation

AJAX Scripts - Ajax form validation

51. Really easy field validation

AJAX Scripts - Really easy field validation * Dexagogo

52. AJAX fValidate: a high quality javascript form validation tool

AJAX Scripts - fValidate | Type Reference | A high quality javascript form validation tool

53. Ajax newsletter form

AJAX Scripts - Ajax newsletter form

54. wForms: A Javascript Extension to Web Forms - The Form Assembly

AJAX Scripts - wForms - A Javascript Extension to Web Forms - The Form Assembly - The Form Assembly

AJAX Grids, Tables

55. Data Grids with AJAX, DHTML and JavaScript | Smashing Magazine

AJAX Scripts - Data Grids with AJAX, DHTML and JavaScript | Smashing Magazine

56. Grid3 Example

AJAX Scripts - Grid3 Example

57. AJAX Table Sort Script (revisited)

AJAX Scripts - frequency decoder | Unobtrusive Table Sort Script (revisited)

58. AJAX Sortable Tables: from Scratch with MochiKit

AJAX Scripts - Sortable Tables from Scratch with MochiKit

59. AJAX TableKit

AJAX Scripts - TableKit

AJAX Lightboxes, Galleries, Showcases

60. 30 Scripts For Galleries, Slideshows and Lightboxes | Smashing Magazine

AJAX Scripts - 30 Scripts For Galleries, Slideshows and Lightboxes | Smashing Magazine

61. AJAX LightBox, Sexy Box, Thick Box

AJAX Scripts - NoFunc · Sexy Box · Javascript

62. AJAX Lightbox JS

AJAX Scripts - Lightbox JS

63. AJAX Unobtrusive Popup - GreyBox

AJAX Scripts - Orangoo Labs - GreyBox

64. SmoothGallery: Mootools Mojo for Images | Full gallery

AJAX Scripts - JonDesign's (Javascript) SmoothGallery: Mootools Mojo for Images | Full gallery

65. AJAX Libraries and Frameworks

AJAX Libraries and Frameworks | Smashing Magazine

Visual Effects, Animation

66. How to Create Digg Comment Style Sliding DIVs with Javascript and CSS

AJAX Scripts - Firblitz: Re: How to Create Digg Comment Style Sliding DIVs with Javascript and CSS

67. How to Create a Collapsible DIV with Javascript and CSS

AJAX Scripts - Harry Maugans » How to Create a Collapsible DIV with Javascript and CSS

68. How to Create an Animated, Sliding, Collapsible DIV with Javascript and CSS

AJAX Scripts - Harry Maugans » How to Create an Animated, Sliding, Collapsible DIV with Javascript and CSS

69. AJAX Shopcart

AJAX Scripts - script.aculo.us - web 2.0 javascript demos

70. Draggable content

AJAX Scripts - Dragable content

71. Dragable RSS boxes

AJAX Scripts - Dragable RSS boxes

72. AJAX Pull Down Effect: Rico Framework

AJAX Scripts - Rico

73. AJAX Animation Effects: Rico Framework

AJAX Scripts - Rico

74. Combination Effects in scriptaculous wiki

AJAX Scripts - Combination Effects in scriptaculous wiki

75. AJAX Motion Transition: Fx.Morph

AJAX Scripts - mootools demos - Fx.Morph

Useful Basic JavaScripts

76. 9 Javascript(s) you better not miss !!

AJAX Scripts - 9 Javascript(s) you better not miss !!

77. Top 10 custom JavaScript functions of all time

AJAX Scripts - Top 10 custom JavaScript functions of all time

78. Hyperdisc Materials: JavaScript: Top 10: Automatic Breadcrumb Trail

AJAX Scripts - Hyperdisc Materials: JavaScript: Top 10: Automatic Breadcrumb Trail

79. JavaScript: Top 10 Most Useful JavaScripts

AJAX Scripts - Hyperdisc Materials: JavaScript: Top 10: Top 10 Most Useful JavaScripts

80. My Favorite Javascripts for Designers: Blakems.com ?

AJAX Scripts - My Favorite Javascripts for Designers: Blakems.com ?

Galleries, Resources

81. MiniAjax.com: a showroom of nice looking simple downloadable DHTML and AJAX scripts.

AJAX Scripts - MiniAjax.com / A showroom of nice looking simple downloadable DHTML and AJAX scripts

82. Ajax Rain: growing showcase of AJAX-examples.

AJAX Scripts - Ajax Rain

83. Max Kiesler - mHub : Ajax and rails examples & how-to’s

AJAX Scripts - Max Kiesler - mHub : Ajax and rails examples & how-to's

84. Ajax Resources

AJAX Resources

85. DZone Snippets: Store, sort and share source code, with tag goodness

AJAX Scripts - DZone Snippets: Store, sort and share source code, with tag goodness

Tag