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!
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"/> ...
Grab the INPUT
button that is within the form and attach a listener to it. Define that listener to loop over a collection of #myform input[type=hidden]
elements, the INPUT
elements within the form myform
that are explicitly marked with type="hidden
".
$$('#myform input[type=button]').addEvent...