Online Forms: Everybody’s Doing It

A post over at the Google Docs blog describes a new form creation feature, Stop sharing spreadsheets, start collecting information:

…in some cases, you want to collect just a tiny bit of information from dozens, scores, or even hundreds of users or more. Some of them are Google Docs users. Some of them are not. Either way, you don’t always want them all mucking around with the whole spreadsheet and you’re tired of telling those new to Google Docs that they don’t need to switch to Gmail just to use Docs (huh? you didn’t know that either?).

We’re really excited to bring you forms! Create a form in a Google Docs spreadsheet and send it out to anyone with an email address. They won’t need to sign in, and they can respond directly from the email message or from an automatically generated web page. Creating the form is easy: start with a spreadsheet to get the form, or start by creating the form and you’ll get the spreadsheet automatically.

Reading the entire post left me thinking of blist, DabbleDB, EditGrid, Smartsheet, Wufoo, and Zoho Creator. It must be at least a little disappointing for the smaller outfits in that list to see Google Docs generating similar technology in-house. Then again maybe this fact is just “validation of the model” as some like to say. Since Zoho Creator is really a project inside the much larger AdventNet I’m not sure its team would care much and in any case the unique thing that Zoho Creator brings to the table is that it has a GUI form builder but also an accompanying scripting language. Sites like EditGrid and Wufoo have great user interfaces, AppJet is doing great things with scripting on the web, but the hybrid approach might be entirely unique to Zoho Creator.

Land of the Lost

I could go into a tortured explanation for what knocked us off-line for several days but why waste time telling sad stories? The important thing is that we’re back. Also, I updated the re<form>ation Wufoo wrapper for Zoho Creator and hope to add support for the Dabble DB format soon. Here are some improvements over what I last described:

• New option to generate and copy/paste static source code for any form configuration
• New option to choose the calendar theme
• New option to specify success message upon successful form save
• Simplified configuration form
• Fixed most IE CSS problems
• Added dynamic generation of title element text based on the Zoho form label

Here are a couple new examples.

Wufoo Themes Revisited

OK our wufoo-ifier is in a little better shape now. Improvements include:

• Theme preview — updates the Wufoo theme each time you select a new one from the dropdown
• Logo switcher — offers several icons to replace the “Wufoo” logo in the upper left hand corner.
• Multiple calendars — supports many date or date/time pop-up calendars on the same form
• Improved style for required fields — asterisks denoting Required fields now better match Wufoo’s style (still broken in Explorer)
• Better support for IE, Safari, and Opera

Just as an aside, I needed a way to dynamically generate a callback to Calendar.setup in a way that most browsers would support and AppJet came to the rescue in about 10 lines of code:

/* appjet:version 0.1 */
/* apject:server */
var qs = request.params;
response.setHeader('Content-type', 'text/javascript');
page.setMode("plain");
print(raw(
"""Calendar.setup({inputField : """ +
"\"" + qs.inputId + "\"" +
""", ifFormat : """ +
"\"" + qs.formatString + "\"" +
""", showsTime : true, button : """ +
"\"" + qs.buttonId + "\"" +
""", singleClick : true, step : 1});"""
));

Generating a callback with client-side JavaScript can go something like this:

//...
var queryString = '?inputId=' + escape(inputId) +
'&formatString=' + escape(formatString) +
'&buttonId=' + escape(buttonId) +
'&noCacheIE=' + escape(noCacheIE);
calScript.id = 'calendar-setup-' + jsonIds++;
calScript.src = 'http://calset.appjet.net/' + queryString;
calScript.type = 'text/javascript';
calScript.charset = 'utf-8';
// etc., etc..

No fuss, no muss. More on the woofuifier later.

Wufoo Themes meet Zoho Creator Forms

ZC2WF can render most Zoho Creator forms using any of Wufoo’s 50 CSS themes. Here are a few examples using some forms from Zoho Creator’s Sample Applications:

• post profile Modern Office theme, redirects to itself
• New Recipient Firenze theme, redirects to itself
• Add Donations Pistachio theme, redirects to itself
• Add New Donor Garden Pool theme, redirects to a Red Cross page

I say “most” forms because the service uses a modified version of Zoho Creator’s JavaScript Client API which means it won’t render any File Upload fields (since the Client API itself does not support these) and any client-side Deluge scripting (including the hiding and showing of fields) set up within the “native” ZC form won’t be available in this skinned version of the form.

Another current limitation is that although Wufoo themes have great support for instructions per-field to help the user, Zoho Creator doesn’t include its instructions for the user in the JSON export of its form definitions. If the ZC team can add this info to the export, I’ll happily add it to the service.

Here’s a zip archive of the relevant files, they can be hosted anywhere without too much hassle. Feel free to experiment with your own forms and I’ll post here as more features become available.

Update: I notice the calendar pop-ups aren’t working in Safari and Opera. I’ll fix that soon…