How to create nested forms.

Update: December 6, 2015 – Fixed several bugs in the code.

Even though I write this article with the perspective on a plugin for WordPress the solution can used anywhere. The example I’ll use to explain how to create a form within a form, aka nested forms, will have no direct links to WordPress but will merely show how to create a form within a form.

For my AVH Amazon plugin I wanted to add a metabox with a form on the Post and Page pages. The purpose of the metabox was to give the user the ability to create the shortcode without having to remember, and type for that matter, all the options.

I wanted users to have the ability to look up their wishlist, show them a the items on their wishlist and give them the option to select one. The problem with this is not so much the form itself, that is pretty straight forward, but the Post and Page pages are almost completely wrapped in a form. The metabox resides with in that form and by design you can’t have a form inside a form in HTML.
It was jQuery, the awesome javascript framework, that bailed me out.

Read the rest of this entry »

Dynamically enable/disable checkboxes in a form.

For a project I’m working on I need a way to disable/enable checkboxes in a form based on which option the user selects from a dropdown list. The easy way would have been to split it up in two forms, the user selects the option from the dropdown list, submits the form and the page reloads and shows the appropriate checkboxes but that’s not what I wanted, it should be dynamic. I knew I had to look at javascript to get this done.

For this example I’ll do everything inline and not use separate files.

Read the rest of this entry »

download