Tuesday, February 28th, 2006

Attack of the Ajax form builders

Category: Ajax, JavaScript, Component, Toolkit, Showcase, UI

Ajax form builders are all the rage lately, so here’s a quick roundup of three of the players in this space.

FormBuilder from the Form Assembly has been around awhile, so it has an impressive feature list:

  • produces standards compliant XHTML/CSS
  • multi-page forms and conditional sections
  • can use predefined themes or user created css
  • optional hosting at the form assembly for easy tracking and usage stats (requires payment)

Its based on the open source libraries wForms and freja. Also check out the form templates available in the library and stylesheets in the form garden.

Form Assembly Form Builder

JotForm is a WYSIWIG, drag and drop builder with scriptaculous under the covers. According to Aytekin Tank, the creator, its similiar to the builder in Visual Studio. Right now its compatible on Firefox and IE with Safari support coming. Check out the flash-based tour for a feature lineup.

JotForm

Wufoo is a form creator from the guys at Particle Tree thats just an interface demo right now. It uses Flash 8 under the covers and works in FF 1.5, Safari 2, and almost IE6. It has some thoughtful “higher level” widgets for things like phone number, star ratings, tags, and dates. The interface follows more of a wizard type approach and certainly looks cool with some nice transition effects.

WuFoo

Which builder do you see as having some staying power? Which one, if any, could you see using in your day to day development? Will you stick with hand coding and only use these for quick prototypes, if at all?

Posted by Rob Sanheim at 11:43 pm
44 Comments

+++--
3.9 rating from 106 votes

XMLHttpRequest Vs. iFrames

Category: Ajax

On Sys-Con.com, there’s a short little look at two methods of doing a lot of the same things - a comparison of Ajax versus iFrames.

Should you use the old iFrame tricks or the new XMLHttpRequest? There is not better or worse when comparing these two techniques, but they are certainly different. While both of them allow you to communicate with the server in the background, you should choose the appropriate for your situation depending on a few questions: Do you want the back-forward buttons to work? Do you plan to perform more than one simultaneous request? Do you need cross-site calls? Do you need to monitor the status of your calls?

He answers these questions, most of them right away with a table listing of the differences between the two (”multithreaded”, “cross-site”, etc). These are followed by arguments for both sides, spotlighting things like:

  • that iframes are easier to monitor, but won’t let you multi-thread
  • Ajax tends to break the back button, but it’s also easier to understand what’s happening with it (via the status codes).
  • neither supports anything that would allow cross-site scripting (for Ajax, a restriction. for iframes, the lack of control between parent/child)

Posted by Chris Cornutt at 2:16 pm
8 Comments

+++--
3.8 rating from 58 votes

Ajax Plugin Released for jQuery

Category: Ajax, JavaScript

For all of the jQuery fans out there (or anyone, really that wants a lightweight, powerful Javascript framework), there’s been a new plugin released to integrate Ajax support into this popular package.

The new AJAX plugin for jQuery is ready - and if you’re running off of the latest code, it’s already rolled in. Along with that, there are a few new effects to be enjoyed: fadeIn, fadeOut, and center. I’ve also squished a number of bugs, which have gone into this release too.

You can find out more about this new plugin over on this page of the jQuery site and, if you want more info about the framework in general, head to their main page.

Posted by Chris Cornutt at 2:09 pm
6 Comments

++++-
4.1 rating from 39 votes

Ajax homepages market review

Category: Editorial, Articles

Richard MacManus has written a nice roundup piece that reviews the various Ajax homepages, including the big guns and the new guys on the block.

Richard looks at traffic, features, and strongly favours the portals with open APIs as future winners.

Microsoft and Google will likely dominate this space, with Yahoo perhaps entering the market with its own widgets homepage in the near future. With an asset like Konfabulator on its books, it’d be strange if they don’t at least re-design My Yahoo to accomodate web services and widgets. Among the smaller companies, Pageflakes seems to be the most promising with its API support. It’s not too late though for Netvibes and the others to join the party and open up their platforms to developers.

Posted by Dion Almaer at 9:02 am
4 Comments

+++--
3.9 rating from 16 votes

Mail2RSS

Category: Showcase

Zoran Juric has created a clean Ajax Mail2RSS gateway. The Ajax techniques shown allow you to get up and running in seconds.

Mail 2 RSS

Posted by Dion Almaer at 8:52 am
8 Comments

+++--
3.4 rating from 16 votes

AJAX and Session “Race Conditions”

Category: PHP, Programming

From the SitePoint PHP Blog, there’s a new post from Harry Fuecks that talks about issues concerning race conditions and Ajax.

He quotes Marc Wandschneider as saying, basically, that since PHP scripts are executed in their own little environment, there’s not so much worry about the access of more than one page at once on that instance. Ajax breaks this model, however, making it possible to pull several pages from different instances all into one place. This could cause a “race condition” with your session information on the server if not handled correctly.

Now before I go any further—this is not a PHP problem despite the title (I hope the web ring is paying attention)- this is is a feature of HTTP—it’s stateless. The problem is really the blurring of lines AJAX introduces—this goes right to the line between the two kinds of AJAX - is the client or the server managing state?

I’d broaden that a little—in short, using a stateless protocol like HTTP, any attempt to lock server side resources across requests will always be an ugly and potentially dangerous hack. For example, what if the client suffers a power cut, shortly after locking something?

In more references to quotes from Mr. Wandschneider, he also notes that the best way to deal with scripts/applications that might cause these sorts of problems is just to avoid them all together. More often than not, they’re just not worth the headaches they will cause. He also suggests that a move to a J2EE platform might not be the best answer if the bridging of session data across multiple sessions is needed, as suggested by Marc.

Posted by Chris Cornutt at 7:55 am
5 Comments

++++-
4 rating from 17 votes

XML Responses and AJAX

Category: XmlHttpRequest, Programming

DevArticles has posted a new tutorial to follow their previous item working with Ajax messages and responses with help from an ActiveX object. This time, they focus on the responseXML return value from the Ajax call.

If the response is XML, the responseXML represents the value derived via DOM object parsing. The reader should review the properties and methods discussed in my previous tutorials on AJAX and XMLDOM, so that reading this one will be easier. JavaScript works easily with the XMLDOM object. In this tutorial we will be accessing an XML document via AJAX.

Just like in the previous tutorial, they create the object they’ll use to work with the XML right at the start. They then take a second to look at the innerHTML attribute, showing what it is and how it can be used. They follow with an example XML response, the code to pull it over with Ajax, and how the object can be used to parse this result into something useful. They even include a detailed description of how to parse the XML document’s contents (versus just throwing the code out there and saying “this is the end result”).

Posted by Chris Cornutt at 7:43 am
5 Comments

+++--
3.8 rating from 20 votes

Monday, February 27th, 2006

Bandzoogle.com: Web Application Developer

Bandzoogle.com, the leading website builder for bands, is looking a web
application developer to join our team. We are a stable, profitable, fun
and fast growing web company with a tremendously supportive user base.

We are looking for a talented programmer with strong problem-solving skills
who can learn and adapt quickly to new technologies. This programmer will
be welcomed into our small team and given the opportunity to participate in
the direction of the company as it grows.

Specifically, we’re looking for:

  • 3+ years experience building dynamic web applications (PHP, Coldfusion,
    etc.)
  • demonstrated experience building UI components using
    DHTML/Javascript/XHTML/CSS/AJAX
  • strong UI design skills and a great eye for useability
  • previous experience with Coldfusion and Fusebox is a plus–fast learners
    will be considered
  • experience using SQL (esp. MySQL)
  • a love of clean, efficient code
  • available to telecommute on a full time basis
  • a musician, or just someone who loves music

We offer:

  • Fun, challenging projects
  • An easygoing, dynamic team environment
  • Freedom to manage your own schedule
  • Time and resources to update your skillset
  • Generous bonus structure
  • Reimbursement of home office expenses
  • Music industry perks (free CDs, concerts, etc.)
  • Full health benefits (if working from Canada)
  • Stable employment with a business that is debt-free and profitable
  • A stress-free, dynamic workplace free of pointy-headed bosses!

This is a full-time, salaried position with the option to telecommute or
work from our office in beautiful Montreal, Quebec.

To apply:

Email your resume to jobs@bandzoogle.com

Posted by Dion Almaer at 10:05 pm
1 Comment

+++--
3.4 rating from 10 votes

Edge IO Launched

Category: Showcase

Michael Arrington of TechCrunch blogged about a company that he has founded called Edge IO.

Edge IO is classifieds with a twist. You can post classified requests on your own blog, and Edge IO will automatically pick it up. No need fora centralized system.

The UI is very nice too, and Ajax is abound.

The search widget on the right hand side is a good example. It starts off using a “Live Search” to find your location, and then gives you a slider so you can change the scope of your important query. Maybe soon you will see the scaling as a map on a globe ;)

Edge IO Search Widget

Posted by Dion Almaer at 1:34 pm
3 Comments

+++--
3 rating from 32 votes

Logahead - A Fully Buzzword Compliant Blogging Engine

Category: PHP, LiveSearch, LiveEdit

Lots of comments have been flying around about a new completely “from the ground up” implementation of a blog that’s, as they put it, “fully buzzword compliant (AJAX, RSS, Web 2.0 - it’s all there)”.

The Logahead blogging engine offers many of the regular features that blogging software provides, but has been reworked to make it simpler - ease-of-use is key. To achieve this level of simplicity, the entire blog can be maintained directly from the homepage, logins/protected content and all. They support tagging for each entry, draggable/sortable widgets for the sidebar, an “admin toolbar” that loads when an authorized user logs in, inline post adding and editing, livesearch, RSS feeds, easy text formating, and much more.

Most importantly, you can check out a demo of the app here.

You can get all of the deatils on the software at their site, including support and a forum to interact with other Logahead users. Currently, the download is a beta version (version 1.0), and requires PHP and MySQL to get up and running.

Posted by Chris Cornutt at 10:43 am
9 Comments

+++--
3.2 rating from 39 votes

Ajax Scaffold Generator

Category: Ruby, Prototype, Showcase

Richard White has created an Ajax Scaffold Generator for Ruby on Rails. This takes the default scaffolding that Rails produces, and turns it up a notch. Now your admin pages can do a lot of CRUD on the same page.

The latest 2.0 version of the tool features:

  • The generated scaffold code looks production ready: valid XHTML, CSS, fully styled.
  • It now uses a <table>
  • Its designed to be used as a component so you can easily create an admin console with a couple generated scaffolds.
  • A number of CSS styles have already been included for commonly used elements like required field labels, example field input and for some basic form layout control (explained later in this article).
  • Works on Firefox 1+, IE 6+ and Safari 2+ (It make work on others, but I haven’t tested anywhere else, so let me know what you find out)

Ajax Scaffold Generator

Posted by Dion Almaer at 9:58 am
2 Comments

++++-
4.1 rating from 72 votes

IntelliJ IDEA Ajax Screencast

Category: Editorial, Screencast

IntelliJ IDEA is a fantastic Java IDE that many of the Ajaxians use on a daily basis. Although their bread and butter is Java development, they started to put JavaScript functionality into their IDE, and stepped it up from being a bit of a toy, to something quite useful in IntelliJ IDEA 5.1.

They have put together a screencast showing the tool building a simple Ajax application where you see all of the completion magic that makes sure that you never get those typos.

Over on JavaLobby they used this as a lead in to ask What do you need/want from an AJAX tool?, so we re-ask this to the Ajaxian audience. What do you guys want to see in a Ajax development tool?

Do you want a WYSIWYG experience? Or a killer JavaScript source editor? Builtin support for Prototype and Dojo?

IntelliJ IDEA Ajax Demo

Posted by Dion Almaer at 8:41 am
7 Comments

++++-
4.1 rating from 25 votes

Ajax Multiplayer Chess

Category: Prototype, Showcase, Games, Comet

Piotr Dachtera has created a full interactive multiplayer chess server based on Ajax (using Prototype and Script.aculo.us).

There is a lot going on in the game such as:

  • Built-in chat
  • Drag and drop of pieces
  • Animation of pieces as they move

Ajax Chess

Posted by Dion Almaer at 8:32 am
12 Comments

++++-
4.1 rating from 51 votes

Saturday, February 25th, 2006

“Future of Web Apps” Podcasts

Category: Workshop, Web20

Carson Workshops has released MP3s for the “Future of Web Apps” workshop (via Phil Dawes), which means many pleasurable listening hours about Ajax and related topics. There are also a number of blog posts linked, including these detailed notes from Simon Willison.

You’ll find eight MP3s, around 40 minutes each:

  • Shaun Inman (Mint)
  • Tom Coates (Yahoo!)
  • Ryan Carson (DropSend)
  • Carl Henderson (Flickr)
  • Steffen Meschkat (Google)
  • David Heinemeier Hanson (37Signals)
  • Joshua Schachter (Delicious)
  • Panel Discussion

Though labelled as podcasts, I couldn’t find a feed, so here’s an unofficial podcast feed with all the MP3s - add it to your podcatcher to grab them all.

Carson Workshops have more Ajax-related events coming up as well.

Update: You can also subscribe via Odeo.

Posted by Michael Mahemoff at 8:50 am
8 Comments

+++--
3.9 rating from 33 votes

Friday, February 24th, 2006

Creating sortable lists with PHP and AJAX

Category: Prototype, PHP, UI, Programming

phpRiot has posted a tutorial that pairs PHP and Ajax together (the perfect combination?) to create sortable lists.

ou might have been in a situation before where you had a list of items in your database that needed to be output in a specific order. These items could be anything: perhaps a listing of your favourite movies or your favourite books. For whatever reason, you want them ordered in a custom way that can’t be determined automatically (such as alphabetical).

This article covers the implementation of a system that lets you easily define the order of such a list.

The lists they feature are the drag-and-drop types, created with the help of the Prototype and Scriptaculous libraries. A fully-interactive example of the lists is shown on the first page of the tutorial.

They walk through the creation of the entire setup, both client-side and server-side, deatiling each of these steps along the way:

  • the database creation, showing how the table is defined - shown for both MySQL and PostgreSQL
  • the PHP code used to generate the list output to the browser via a database layer and two logic/output files
  • adding the drag-and-drop capability to the script, via Scriptaculous and some CSS
  • writing the PHP script to handle the sorting changes (the script Ajax calls)
  • and, finally, working up the Ajax code to be fired off when the user changes the order of the list

Posted by Chris Cornutt at 11:16 am
10 Comments

+++--
3.6 rating from 106 votes

Rich, accessible pagination with unobtrusive javascript

Category: Usability, JavaScript, Programming

In this post on bluesmoon.blogspot.com, there’s a walk-through (complete with code) of a method for doing pagination with Ajax that’s both simple and accessible.

I’ve seen a few questions about doing pagination with AJAX, and I don’t like the thought of it. It smells of accessibility problems. I’ve addressed this issue before in my own toy pages (since I don’t actually write production web code), so thought I’d share it.

The entry is broken up into parts - the “Problem Definition”, “Six steps from vanilla HTML pages to AJAX pages”, “The Code”, “A brief explanation”, and some “Improvements” (and suggestions) he’s made to make the original code cleaner.

For each of the sections, he details the step, being sure to lay out the problem completely before diving into the code. The “Six Steps” help with this, providing the “peudo-code” for him to follow when working it up. The system is built on top of a PHP and MySQL backend and uses JSON for the actual data transfer. The current location and previously viewed pages are stored in the database, and he code is such that it will fall back to the normal anchor tag links if Javascript it turned off.

Posted by Chris Cornutt at 9:41 am
5 Comments

+++--
3.4 rating from 66 votes

Next Page »