asked on

Dynamic Content from a checkbox

How can I have a user view more content on page by checking a checkbox?

So they hit the order page and it shows the billing address and the shipping address. Below the shipping address they have the option to ship part of the order to someone else. But instead of showing the extra shipping form I would like to have a checkbox and when the use checks it the new info is displayed? Any thoughts?

Thanks in advance!!

Owen

montonen

Hi Owen

This is more of an DHTML and Javascript problem.
This could help.
Browser dependent code... but I guess you get the idea.

<html>
<head>
<title>Dummy Test</title>
<script language="JavaScript" type="text/JavaScript">

</script>
</head>

<body>
<form name="form1" method="post" action="">
<p>
<input name="checkbox" type="checkbox" onClick="javascrip:showForm('moreForm');" value="checkbox"> More form
</p>
<p>
<SPAN style="visibility:hidden" id="moreForm"><textarea name="textarea"></textarea></SPAN>
</p>
</form>
</body>
</html>

Regards
Jonas Montonen

ASKER CERTIFIED SOLUTION

montonen

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

owenj24

ASKER

I will test this out tonight...thanks a lot...will close question out then!

Thanks again!

Owen

owenj24

ASKER

Hmmmm...it looks like it works in IE but not Mozilla. So it looks like you were correct in "- Make the setting of visibility browser independent (browser check and normally duplicate code for different versions)"

So I will play around a bit more with it tonight (Got bored at work just now ;-) ) But I think you have pretty much answered this. But feel free to add more if ya like ;-)

Thanks!

Owen

tirdun

You could have the checkbox submit the page to itself.

(onCheck="document.form.submit()")

During each page load PHP can check to see if the checkbox is set using issset($_POST[]). If not, it won't show the extra data. You could expand further by setting multiple checkboxes (or links or buttons or whatever) and having PHP check each one before showing the extended data. It means reloading the page each time, but it's more platform-friendly than DHTML.

If you want to alter the form to submit to other pages you can create simple javascripts to change the form action:

function formsubmit(newpage)
{
document.form.action=newpage;
document.form.submit();
}

so any form element can use:
OnWhatever="javascript:formsubmit(nextpage)"

Since Radio and Checkboxes are a pain to check sometimes in JS and PHP you could also have a function to set a hidden value by checking the box, then reloading the page:

function switchvalue(element,newval)
{
changelement = eval("document.form."+element);
changeelement.value = newval;
document.form.submit();
}

and in the HTML body have:

<input type="checkbox" name="more" onCheck="javascript:switchvalue("showmore&quot,"yes")">;
<input type="hidden" name="showmore" value="no">

Then have

if ((!isset($_POST["showmore"]))&&($_POST["showmore"]=="yes")):
# // Extra HTML stuff
else:
# // No Extra HTML stuff
endif;

snoyes_jw

No comment has been added lately, so it's time to clean up this TA.
I will leave the following recommendation in the Cleanup topic area:

Answered by montonen

Please leave any comments here within the next seven days.

PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!

snoyes_jw
EE Cleanup Volunteer