forms with extra fields as necessary

[Robert Poole]

Okay, here is my latest coding conundrum...

I'm putting together a form with the possibility of two addresses. First of all they have to fill in the first address - mandatory.

The second address however only needs to be filled in if it's different from the first address...

So what I would like is a checkbox (something like "My shipping address if different to my first address" or whatever) that when checked displays a few more address fields for a second address.

Possibly even trickier... when the checkbox is unchecked these extra address fields are no longer displayed... so they disappear into the nether-regions of a bad coding nightmare... until someone clicks on the checkbox again.

I hope you guys get the drift of what I'm trying to put together... I think it may require some javascript but I'm not sure.

I look forward to your responses.

[Habtom]

This is more of a JS question, and not much to do with PHP.

It can be done by hiding and showing a div, and if you google it [google.com] you will get some sample codes and explanations how to implement them.

Habtom

[Robert Poole]

So I guess my next question is gonna have to be how do I wrap the divs around table rows? My form has about 6 table rows for a new address and I need to hide all these when they're not needed.

[Arno_Adams]

Hi Robert,

don't use a div, use a tbody and toggle it's visibility.

HTH, AA

[Robert Poole]

Great look Arno, I'd never head of tbody before but it's a neat little gizmo.

For future surfers who stumble across this page I used the following in my header:

<script type="text/javascript">
function hideShowHTMLItem(itemID, iState)
{
htmlItem = document.getElementById(itemID);
if (htmlItem)
{
if (iState == 0)
{ // hide
htmlItem.style.display = 'none';
}
else
{ // show
htmlItem.style.display = '';
}
}
}
</script>

and then used

<input name="mainyes" type="radio" onclick="hideShowHTMLItem('mainrow', 1); disablemain();">Yes<br/>
<input name="mainno" type="radio" onclick="hideShowHTMLItem('mainrow', 0); enablemain();">No

to show/hide the extra table elements which were surrounded by the tags <tbody id="mainrow"> and </tbody>

Cheers again.