MooTools 1.3 Cookbook

Creating a group of elements that add their NAMEs and VALUEs as text in a DIV

Often in dynamic DOM manipulation of a web form, we must check the contents of the DOM using a live HTML debugger like Firefox's Firebug HTML Panel. This recipe is for those ready to have a quick look at a particular group of hidden elements. Get ready to turn on the light and watch the critters scatter; they're not so hidden anymore!

Getting ready

Start with a form that has hidden elements that we can mine for display.

<form id="myform" action="">
<input type="button" value="Show values"/>
<input type="hidden" name="h_1" value="Matthew"/>
<input type="hidden" name="h_2" value="Mark"/>
...

How to do it...

Grab the INPUT button that is within the form and attach a listener ...