Tag Archives: Google Forms

10.02.11
by

Form Validation Working!

I have required field form validation working.  I haven’t released it yet but in my testing, it appears to catch all of the fields I defined as required.  WordPress Google Form incorporates the jQuery Validation plugin.

When a page loads, the jQuery script runs and scans the Google form for required fields.  For each required field it finds it adds the gform-required class to the input or textarea tag.  When the validator runs, it looks for fields which have the gform-required class and if any are empty, a label is added with the gform-error class.

The gform-error class is defined in the default CSS to display the text in red and float it to the right of the input.

As can be seen in the image, if there isn’t enough room to the right of the field, the error will be shown just below it.  As with most CSS solutions, there are a bazillion ways to customize the output, I have elected to use something real basic and let the plugin user add more CSS if desired.

If you would like to try this early release of the plugin and give me some feedback, you can download it here.  The version in the WordPress repository is still the older v0.9 release.

[download#7]

 

09.29.11
by

GForm validation bug PoC

This afternoon I spent some playing with a jQuery Form Validation plugin to determine if it will help me resolve the issue with required fields.  The initial results look fairly promising as I was able to tag a couple fields on a test form and they were flagged when I submitted it.

In the image above, the jQuery Validation plugin added the “Thus field is required” when I submitted the form with those fields empty.   This is exactly the behavior I want, the challenge now is to scale my Proof of Concept (PoC) to work in the generic case of the plugin.  The Google form defines a block for each input field and the class the denotes a field as required is assigned to one of the DIV blocks that wraps the label and form element (e.g. INPUT or TEXTAREA tag) as opposed to the form element tag itself.  This makes finding the required elements a little tricky.

The real challenge I think will be input groups (e.g. radio buttons and check boxes).  I need to do some jQuery research before I have a solution but assuming I can figure out which elements to select, I believe this will solve the problem with required fields.

09.29.11
by

WordPress Google Form bug with required fields

Google forms allow fields to be designated as required.  When running the form using the standard Google URL, the form will be validated and presented back to the user if any of the required fields are not entered.  There is an issue (aka bug) with required fields in the current version of the plugin.

If a user submits a form that is embedded in WordPress using the plugin, because there are missing fields the form processing does not complete.  There is no indication for the user that something is wrong, the form is simply presented again without any of the fields having data in them.

To resolve this I am looking at doing form validation on the client side using a jQuery plugin.  Hopefully I will have this resolved fairly quickly as I need this to work correctly for my own project.  My testing didn’t take into account a user not completely the form correctly.  Oops.  This bug affects all versions of WordPress Google Form up to and including v0.9.

Stay tuned.

09.23.11
by

Screen shots added to WordPress Google Form plugin

I have added the missing screen shots to the WordPress Google Form plugin.

The plugin has been updated to v0.9 and will appear in the WordPress Updates on the Dashboard.

09.22.11
by

wpGForm plugin updated to v0.8

Over the past 24 hours I have committed a number of changes to my wpGFrom plugin.  The WordPress auto update process sometimes takes a little while to recognize a new version is out there but v0.8 should appear fairly soon.  I actually updated it a couple times so you may have seen v0.6 and/or v0.7 show up as well.

This update addresses two bugs (the spurious output of CSS and embedded Javascript) and also adds some new features.  Check out the Changelong on the WordPress plugin repository for more details.  I’ve been using the plugin for one of my own projects and to the best of my knowledge, it is working ok.  If I don’t run into anything else in the next week or two, I’ll bump the version to 1.0 and call it ready.

09.11.11
by

wpGForm v0.5 fixes Settings page bug

I have just committed v0.5 of the WordPress Google Form plugin.  It addresses the problem with the Tabs on the Settings page not working correctly.  It turns out that I had a couple of problems which were masked by the theme I was using.  I have moved my development environment back to the stock Twenty-Eleven theme and turned off all other plugins.

By doing this I determined that the jQuery UI libraries I expected to be loaded, were in fact, not loaded at all.  They were being loaded by the theme!  Once I got the libraries loaded correctly the Tabs started working but they didn’t have the proper styling.  WordPress doesn’t appear to include the jQuery UI CSS so I ended up loading it from Google’s CDN.

Everything seems to be working correctly now, v0.5 should appear as an update shortly if it hasn’t already.

 

09.11.11
by

WordPress Google Form Settings Bug

The WordPress Google Forms settings page makes use of tabs to show information about the plugin and set its options.  It appears that the theme I was using, which I am in the process developing, is the culprit.  It loads some new jQuery functionality from Google’s API that apparently allowed the tabs to work as I expected.  I am not sure yet why the builtin WordPress jQuery functionality isn’t working correctly as I expect it should.

Now that I know where the problem is, I think it should be pretty straight forward to fix it.

09.11.11
by

WordPress Google Form Plugin

I’ve spent some time over the last couple of days cleaning up the WordPress Google Form plugin I’ve been working on and getting it added to the WordPress plugin repository.  I am happy report that I think I have a stable version (v0.4) finally available that people can play with.

I’ve added a Sample Form and the corresponding Sample Results collected from form submissions if  you are interested in seeing what the plugin looks like in action.

This plugin resulted from a need to collect data in a simple manner that could be managed in a spreadsheet.  Google Docs provides an easy to use spreadsheet that be used to store the data.  Google Forms provides a mechanism to design a form that can add data to the spreadsheet.  The WordPress Google Form plugin allows the form to be added to a WordPress site and maintain the look and feel of the active theme.

Note:  It looks like I didn’t flush out all of the bugs – the tabs on the Settings page are not working correctly!

09.09.11
by

WordPress Google Form Plugin

For the past couple of days I have been working on a new WordPress plugin I am calling WordPress Google Form.  This morning I received the approval for adding it to the WordPress plugin repository so I will be doing that over the next couple of days.  I spent much of the last two days on an airplane so the plugin is currently in a state where I have it modified to work offline but I’ve done enough online testing that I am pretty confident I have something working.

My interest in Google Forms stems from the work I am doing on a site for our Middle School.  We have a need to collect information in the form of Booster Club memberships and while there are a number of Membership type plugins, none of them really do what I want.  Ultimately what we need is a spreadsheet of names, addresses, and phone numbers and Google Docs will work well for that.  Putting a Google Form on the front end will allow us to capture the data online.

I thought integrating the Google Form with our WordPress site would be pretty simple, Google offers the ability to embed a form using an IFRAME.  Unfortunately the ability to style the form is pretty limited and the Confirmation page even less so.

I have been using the Google Inline Spreadsheet Viewer plugin to display the data from our Google spreadsheets, I was somewhat surprised to find that there doesn’t seem to be anything similar for Google Forms.  So I decided to write one.  Borrowing some ideas from the Google Inline Spreadsheet Viewer plugin, I have created a plugin that defines the shortcode gform.  The gform shortcode takes a Google Forms URL and extracts the FORM body content, cleans it up, and outputs it for WordPress posts, pages, and widgets.

There are a number of attributes that can optionally control the output, the most significant is the confirmation page which can redirect to a page within the WordPress site instead of the default Google conformation page.

More details to follow soon and I hope to have an example up and running later today.