php - Checkbox to change value of a true vs false function -

i have contact form uses following code determine whether or not display long form or short form.

<?php   $itemid = jrequest::getvar('itemid');   $menu = &jsite::getmenu();   $active = $menu->getitem($itemid);   $params = $menu->getparams($active->id);   $pageclass = $params->get('pageclass_sfx');   if (strpos($pageclass, 'short') !== false) {     $shortform = true;   } else {     $shortform = false;   }   ?> 

i have short form area in html, , else if area..

<div class="reqd">     <div class="fields">       <div class="column first">         <label for="firstname">first_name_label<span> *</span></label>         <input type="text" name="firstname" id="firstname" title="this_field_is_required" />       </div>       <div class="column last">         <label for="lastname">last_name_label<span class="reqd"> *</span></label>         <input type="text" name="lastname" id="lastname" title="this_field_is_required" />       </div>     </div>   </div>   <div class="fields">     <div class="<?php if (!$shortform) echo 'column first '; ?>reqd">       <label for="company">company_label<span> *</span></label>       <input type="text" name="company" id="company" title="this_field_is_required" />     </div> <?php if ($shortform): ?>   </div> <?php else: ?> 

the value of $shortform set class of menu item in joomla.

i'd add checkbox on form allow viewer switch between longform , shortform versions of form.

i new , appreciated!

edit based on response: not working me.. need put php in html id short form , long?

<input type="checkbox" name ="more" id="more" onclick="toggletext();" />  <div class="shortform">        <div id="fistname">         <label for="firstname">first_name_label</label>         <input type="text" name="firstname" id="firstname"/>       </div>        <div id="lastname">         <label for="lastname">last_name_label </label>         <input type="text" name="lastname" id="lastname"/>       </div> </div>   <div class="longform">        <div id="company">         <label for="company">company_label</label>         <input type="text" name="company" id="company"/>       </div>        <div id="email">         <label for="email">email_label</label>         <input type="text" name="email" id="email"/>       </div>  </div> 

and here js.

function toggletext() { if (document.getelementbyid('more').checked == true){    document.getelementbyid('longform').style.display = 'none';    document.getelementbyid('longform').style.display = 'block'; } else {     document.getelementbyid('longform').style.display = 'block';     document.getelementbyid('longform').style.display = 'none'; } } 

so first thing understand php server side language , javascript client side language....php runs...then js runs. if want hide , show content need load front end build js hide/show it. of course can dynamically pull in content via ajax if pretty new whole thing recommend keeping simple....

so output 2 divs via php....one contains short form other long form. hide (via css) 1 don't want displayed default.

then on checkbox...add onchange='toggletext'

which like..

function toggletext() { if (document.getelementbyid('checkboxid').checked == true){    document.getelementbyid('longformid').style.display = 'none';    document.getelementbyid('longformid').style.display = 'block'; } else {     document.getelementbyid('longformid').style.display = 'block';     document.getelementbyid('longformid').style.display = 'none'; } }  

obviously need swap in ids...this code not tested demonstrate idea.