Ajax

Ajax Tutorial: Drag & Drop
White Paper

Abstract

This Ajax tutorial explains how to easily add the popular drag and drop functionality to your web site.
Ajax Tutorial: Drag & Drop Revised by Chris Rindal QA Technician, Tometa Software, Inc. Page 1 of 14

Tometa creates custom software for you

Tometa Software designs and develops robust software solutions for virtually all industriesincluding in-house (vertical market) and retail software, some of which is on the shelves at your local software store. We focus our unique combination of creative, technical, and problem-solving skills on meeting our client's objectives. Because of our clarity of purpose, commitment to process, and broad professional skill sets, we are able to provide our clients with worldclass solutions thatare functionally superior and fully aligned with our client's strategic focus.

Balancing development speed, quality and cost is what we are all about. Tometa combines agile development practices with fixed pricing, so you know what the cost, end product, and delivery time table look like–up front. If we underestimate the effort, we complete the overrun on our dime. Simple as that. That’s whylarge enterprise firms like Alcoa and NASDAQ choose Tometa.

Tometa’s agile development expertise and low-overhead US location keep our prices comparable to offshore vendors – without offshore challenges. Using a fixed pricing model, we provide upfront visibility into a project’s ultimate costs, end product and delivery schedule. Our clients like knowing that we have “skin in the game” – a fixedprice that aligns our goals with yours, incenting us to get the job done right and fast.

Lastly, as a Microsoft Certified Gold Partner, Tometa Software, can customize its products or create custom web, client/server, and traditional applications. With programming experience in C#, C++, Visual Basic, CGI, HTML, RPG, Delphi, Java and many others; Tometa Software is uniquely positioned to meet yourneeds as a development firm.

Check us out today

Ajax Tutorial: Drag & Drop Revised by Chris Rindal QA Technician, Tometa Software, Inc.

Page 2 of 14

If you’re into Web Development, chances are you’ve used Ajax on a few occasions. For those of you who haven't heard about this exciting and relatively new technology, let me give you a quick low down. Ajax is all the rage in Webapplication Development. It is such an exciting technology that it’s already found use in Google’s most popular applications, such as Gmail and Google Maps. What’s it all about? To put it in simple terms: it's mainly a combination of JavaScript, HTML, XML and Document Object Model (DOM)… with a twist. You see, with conventional JavaScript when you fetch and send information to the server, you need to waitfor a response before the user can do anything on the Webpage. Once the browser receives this information, the webpage will blink a few times and refresh. Sounds tedious, awkward and slow? Well, fear not for Ajax takes it all away: no waiting for the server, no re-freshing and no re-loading. Ajax works “behind the scenes” doing all the “roundtrips” and interaction with the server. This enables theupdate of portions of the Web page without the need to reload or wait for a server response. This makes for a richer and faster browsing experience. To get a taste of Ajax, visit Google Maps and zoom in. Use your cursor to scroll up and down. See how everything happens almost instantly, with no waiting for the page to reload. That’s the magic of Ajax. Now that you’re familiar with what Ajax canachieve, let us put this new technology to some use and learn a few titbits about the language – or shall I say combination of languages. This tutorial will walk you through writing a simple Ajax program to drag and drop a box effortlessly anywhere in the Window. I will be explaining every portion of the code and what it does as we progress through the tutorial. This will give you a chance to...