Code work in FF but not within Chronoforms. Please advice

frediutah 25 Sep, 2010
Drop down selection works fine in FF/IE if you just copy the code into your browser.
Perhaps does work only in IE when I add this code into Form HTML

Seems like document.getElementById('filling_status').value
is not recognize or it is block by Chronoforms....
This supose to be W3C complaint....
I am a newby to js and chronoforms please advice best practice as well.


Thanks for your help!


<?php
function first_load(){
global $activate;
global $fname1;
global $result;
global $result1;
global $middle1;
global $last1;
global $tel1;
global $cell1;
global $address1;
global $city;
global $state;
global $zip;
global $full_name;

$result = null;
$user =& JFactory::getUser();
$db = & JFactory::getDBO();
$db1 = & JFactory::getDBO();
$query = "select * from jos_comprofiler where user_id=". $user->id;
$db->setQuery($query);
$result=$db->loadObject();
$fname1 = $result->firstname;
$middle1= $result->middlename;
$last1=$result->lastname;
$tel1=$result->cb_telephone;
$cell1=$result->cb_cellphone;
$address1=$result->cb_addressline1;
$address2=$result->cb_addressline2;
$city=$result->cb_city;
$state=$result->cb_state;
$zip=$result->cb_zipcode;

$query1 = "select * from jos_users where id=". $user->id;
$db1->setQuery($query1);
$result1=$db1->loadObject();
$activate=$result1->first_logon;
$full_name=$result1->name;
echo"<script src='../components/com_formtest/views/formtest/tmpl/jquery-latest.js'></script>
<script type='text/javascript' src='../components/com_formtest/views/formtest/tmpl/jquery.validate.js'></script>

<style type='text/css'>
* { font-family: Verdana; font-size: 96%; }

label.error { float: none; color: red; padding-left: 6em; position:relative; top: 1px; vertical-align: top; }
p { clear: both; }
.submit { margin-left: 12em; }
em { font-weight: bold; padding-right: 1em; vertical-align: top; }
</style>

<script>
$(document).ready(function(){
$('#first_logon_user').validate();
});
</script>";


$doc = JFactory::getDocument();
$doc->addStylesheet('../components/com_formtest/views/formtest/tmpl/theme.css');
}

first_load();
global $activate;
global $fname1;
global $result;
global $result1;
global $middle1;
global $last1;
global $tel1;
global $cell1;
global $address1;
global $city;
global $state;
global $zip;
global $full_name;


?>
<p align="center"><strong><u>General Tax Organizer 2010</u></strong></p>
<p align="center"> </p>
<div id="vf_form" class="vf_form">

<?php $today = date("D M j Y"); ?>
<p>Date: <?php echo " ".$today ?>
</p><p><?php echo $full_name;?>   
DOB  <input id="DOB" type="text" name="DOB" size="11" />
<p><?php echo $address1;?>
<?php echo $address2;?><br/>
<?php echo $city.", ".$state.", ".$zip;?>
<?php echo "<br/>tel: ".$tel1;
echo "<br/>cel: ".$cell1;?>
</p><br/>
<div>
Filling Status
<select name="filling_status" id="filling_status" onchange="
if (document.getElementById('filling_status').value == 'Married Filling joint') {
optionyes.style.visibility='visible';
optionyes.style.display='block';
mfs.style.visibility='hidden';
mfs.style.display='none';
HOH.style.visibility='hidden';
HOH.style.display='none';
widow.style.visibility='hidden';
widow.style.display='none';

}
if (document.getElementById('filling_status').value == 'Single') {
optionyes.style.visibility='hidden';
optionyes.style.display='none';
mfs.style.visibility='hidden';
mfs.style.display='none';
HOH.style.visibility='hidden';
HOH.style.display='none';
widow.style.visibility='hidden';
widow.style.display='none';

}
if (document.getElementById('filling_status').value == 'Married Filling Separate') {
optionyes.style.visibility='hidden';
optionyes.style.display='none';
mfs.style.visibility='visible';
mfs.style.display='block';
HOH.style.visibility='hidden';
HOH.style.display='none';
widow.style.visibility='hidden';
widow.style.display='none';

}

if (document.getElementById('filling_status').value == 'Head of Household') {
optionyes.style.visibility='hidden';
optionyes.style.display='none';
mfs.style.visibility='hidden';
mfs.style.display='none';
HOH.style.visibility='visible';
HOH.style.display='block';
widow.style.visibility='hidden';
widow.style.display='none';

}

if (document.getElementById('filling_status').value == 'Qualifying Widower') {
optionyes.style.visibility='hidden';
optionyes.style.display='none';
mfs.style.visibility='hidden';
mfs.style.display='none';
HOH.style.visibility='hidden';
HOH.style.display='none';
widow.style.visibility='visible';
widow.style.display='block';
}">

<option value="Single" selected="selected">Single</option>
<option value="Married Filling joint">Married Filling joint</option>
<option value="Married Filling Separate">Married Filling Separate</option>
<option value="Head of Household">Head of Household</option>
<option value="Qualifying Widower">Qualifying Widower</option>
</select>
</div>
<div id="optionyes" style="visibility:hidden">
<fieldset>
<label>Spouse Information</label>
<table width="728" height="74" border="1" align="left">
<tr>
<td width="120" >First Name</td>
<td width="120" >Middle Name</td>
<td width="120" >Last Name</td>
<td width="72" >Date of Birth</td>
<td width="72" >SSN#</td>
<td width="172" >Spouse live with you past June 30</td>
</tr>
<tr>
<td><input name="fname_spouse" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_spouse" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_spouse" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_spouse" type="text" size="10" maxlength="10" /></td>
<td><input name="ssn_spouse" type="text" size="12" maxlength="12" /></td>
<td>Yes<input type="radio" name="living_toghether_prior_June" value="true" checked/>
No<input type="radio" name="living_toghether_prior_June" value="false" />
</td>
</tr>
</table>
</fieldset>

</div>
<div id="mfs" style="mfs" style="visibility:hidden">
<p>
<b>Note:</b> When Married Filling Separate, you and your spouse are both required to itemize deductions if the other is.</p>
</div>

<!--HOH dependents Info -->

<div id="HOH" style="visibility:hidden">
<b>Note</b> that if you are the custodial parent & someone else is claiming the exemption for the child, that you cannot claim the exemption also.
<fieldset>
<label>Dependents Information</label>

<table width="560" height="74" border="1" align="left">
<tr>
<td width="80" >First Name</td>
<td width="80" >Middle Name</td>
<td width="80" >Last Name</td>
<td width="45" >Date of Birth</td>
<td width="45" >Relationship</td>
<td width="50" >SSN#</td>
<td width="60" ># of months living with you</td>
<td width="120" >name of the person claiming on their tax return</td>

</tr>
<tr>
<td><input name="fname_dep01" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep01" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep01" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep01" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_dep01">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_dep01" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_dep01" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep01" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep02" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep02" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep02" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep02" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_dep02">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_dep02" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep02" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep02" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep03" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep03" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep03" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep03" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_dep03">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td> <td><input name="ssn_dep03" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep03" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep03" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep04" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep04" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep01" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep04" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_dep04">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_dep04" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep04" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep04" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep05" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep05" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep05" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep05" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe05">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td> <td><input name="ssn_dep05" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep05" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep05" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep06" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep06" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep06" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep06" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_dep06">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_dep06" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep01" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep06" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep07" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep07" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep07" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep07" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe07">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_dep07" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep07" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep07" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep08" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep08" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep08" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep08" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_dep08">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td> <td><input name="ssn_dep08" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep08" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep08" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep09" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep09" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep09" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep09" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_dep09">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_dep09" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep09" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep09" type="text" size="30" maxlength="60" /></td>
</tr>
<tr>
<td><input name="fname_dep10" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_dep10" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_dep10" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_dep10" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_dep10">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_dep10" type="text" size="12" maxlength="12" /></td>
<td><input name="month_dep010" type="text" size="10" maxlength="10" /></td>
<td><input name="claim_dep10" type="text" size="30" maxlength="60" /></td>
</tr>
</table>
</fieldset>
</div>

<!--widow Info -->

<div id="widow" style="visibility:hidden">
<fieldset>
Spouse's date of death  
<input type="text" name="spouse_DOD" />
</fieldset>
</div>

<!--Required Info -->
<div>
<fieldset>
<label>Required Information</label>
<table width="700" border="1" align="left">
<tr>
<td width="690" >Check if you can be claimed as a dependent on another persons return</td>
<td width="10" ><input type="checkbox" name="claimed_anthr_prsn_rtrn" /></td>
</tr>
<tr>
<td>Check if you are married filling joing, and your spouse can be claimed on another persons return</td>
<td><input type="checkbox" name="spouse_anthr_prsn_rtrn" />
</tr>
<tr>
<td>Check if you are head of household, and claiming a non-resident alien spouse</td>
<td><input type="checkbox" name="spouse_non_resident" />

</tr>
</table>
</fieldset>
</div>

<!--dependent Info -->
<div>
<fieldset>
Check if you have any dependents <input type="checkbox" name="have_dep" onclick="if (this.checked)
{
document.getElementById('dep_agree').style.display='inline';

} else {
document.getElementById('dep_agree').style.display='none';
}
return true;">

<div id="dep_agree" style="display:none">
<fieldset>
<fieldset>
<p>A dependent's income must be under $3650 unless they are a full time student under age 24.</p>
<p>If your dependent children do not live with you, you must provide Form 8332, Release of claim, or, a copy of your divorce decree.</p>
</fieldset>
<fieldset>
Check if you want to continue<input type="checkbox" name="agree_continue" onclick="if (this.checked)
{
document.getElementById('dep_chart').style.display='inline';

} else {
document.getElementById('dep_chart').style.display='none';
}
return true;">
</fieldset>
</fieldset>
</div>

<div id="dep_chart" style="display:none">
<fieldset>
<label>Dependents Information</label>

<table width="560" height="74" border="1" align="left">
<tr>
<td width="80" >First Name</td>
<td width="80" >Middle Name</td>
<td width="80" >Last Name</td>
<td width="45" >Date of Birth</td>
<td width="30" >Relationship</td>
<td width="50" >SSN#</td>
<td width="60" ># of months at home</td>
<td width="120" >Full Time student</td>

</tr>
<tr>
<td><input name="fname_depe01" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe01" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe01" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe01" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe01">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_depe01" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe01" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep01" type="checkbox" /> </td>
</tr>

<tr>
<td><input name="fname_depe02" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe02" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe02" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe02" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe02">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_depe02" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe02" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep02" type="checkbox" /> </td>
</tr>

<tr>
<td><input name="fname_depe03" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe03" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe03" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe03" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe03">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_depe03" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe03" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep03" type="checkbox" /> </td>
</tr>

<tr>
<td><input name="fname_depe04" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe04" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe04" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe04" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe04">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_depe04" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe04" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep04" type="checkbox" /> </td>
</tr>


<tr>
<td><input name="fname_depe05" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe05" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe05" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe05" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe05">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_depe05" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe05" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep05" type="checkbox" /> </td>
</tr>

<tr>
<td><input name="fname_depe06" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe06" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe06" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe06" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe06">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_depe06" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe06" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep06" type="checkbox" /> </td>
</tr>

<tr>
<td><input name="fname_depe07" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe07" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe07" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe07" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe07">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td><td><input name="ssn_depe07" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe07" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep07" type="checkbox" /> </td>
</tr>

<tr>
<td><input name="fname_depe08" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe08" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe08" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe08" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe08">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td> <td><input name="ssn_depe08" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe08" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep08" type="checkbox" /> </td>
</tr>

<tr>
<td><input name="fname_depe09" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe09" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe09" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe09" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe09">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td> <td><input name="ssn_depe09" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe09" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep09" type="checkbox" /> </td>
</tr>
<tr>
<td><input name="fname_depe10" type="text" size="20" maxlength="30" /></td>
<td><input name="mname_depe10" type="text" size="20" maxlength="30" /></td>
<td><input name="lname_depe10" type="text" size="20" maxlength="30" /></td>
<td><input name="DOB_depe10" type="text" size="10" maxlength="10" /></td>
<td><select name="relationship_depe10">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Fosterchild">Fosterchild</option>
<option value="Parent">Parent</option>
<option value="Grand Parent">Grand Parent</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
<option value="uncle">Uncle</option>
<option value="Aunt">Aunt</option>
<option value="Grandchild">Grandchild</option>
<option value="Niece">Niece</option>
<option value="Nephew">Nephew</option>
<option value="None">None</option>
<option value="Other">Other</option>

</select></td>
<td><input name="ssn_depe10" type="text" size="12" maxlength="12" /></td>
<td ><input name="month_depe10" type="text" size="10" maxlength="10" /></td>
<td><input name="student_dep10" type="checkbox" /> </td>
</tr>


</table>
</fieldset>
<fieldset>
Divorced/Separated individuals, please provide a brief description of any important information pertaining to custody and rights to the dependency exemption<br/>
<input type="text" width="600" height="100">
</fieldset>
<fieldset>
Check if you adopt a child during the current tax year
<input type="checkbox" name="adopt_child" onclick="if (this.checked)
{
document.getElementById('adopt').style.display='inline';

} else {
document.getElementById('adopt').style.display='none';
}
return true;">
<div id="adopt" style="display:none; color:blue">
  
Please contact us for more information...
</div>
</fieldset>



</div>
</fieldset>
</div>


<!-- This is the submit buttom -->
<br/>
<p>
<input type="hidden" name="cf_id" />
<input type="submit" value="Submit"/>
</p>
GreyHead 25 Sep, 2010
Hi frediutah,

Best practice is *not* to post several hundred lines of code and expect anyone to look at it.

ChronoForms doesn't 'block' any JavaScript.

I don't see any other question? What **exactly** is the problem?

Bob
frediutah 02 Nov, 2010
Apologies about my ignorance.
Chronoforms is nothing to do with this issue.
is just how I customize the code.
It works perfectly fine in Explorer and Safari but code seems to not work in FF and I dont know how to fix that anyways...

For now it will stay as it is until I found how to make the following to work in FF if somebody knows how to make this work in FF, IE and safari please advice, and a beer will get.

Here is the idea:
Filling Status <select name="filling_status" id="filling_status" onchange=
" if (document.getElementById('filling_status').value == 'Married Filling joint')
{ optionyes.style.visibility='visible'; optionyes.style.display='block';
widow.style.visibility='hidden'; widow.style.display='none'; }

if (document.getElementById('filling_status').value == 'Single')
{ optionyes.style.visibility='hidden'; optionyes.style.display='none';
widow.style.visibility='hidden'; widow.style.display='none'; }

if (document.getElementById('filling_status').value == 'Married Filling Separate')
{ optionyes.style.visibility='visible'; optionyes.style.display='block';
widow.style.visibility='hidden'; widow.style.display='none'; }

if (document.getElementById('filling_status').value == 'Head of Household')
{ optionyes.style.visibility='hidden'; optionyes.style.display='none';
widow.style.visibility='hidden'; widow.style.display='none';}

if (document.getElementById('filling_status').value == 'Qualifying Widower')
{ optionyes.style.visibility='hidden'; optionyes.style.display='none';
widow.style.visibility='visible'; widow.style.display='block'; }">

<option value="Single" selected="selected">
Single
</option>

<option value="Married Filling joint">
Married Filling joint
</option>

<option value="Married Filling Separate">
Married Filling Separate
</option>

<option value="Head of Household">
Head of Household
</option>

<option value="Qualifying Widower">
Qualifying Widow/er
</option>
</select><br>
<br>


<div id="optionyes" style="visibility:hidden;display:none;">
<fieldset>
<legend>Spouse Information</legend>
Ohh nice you have a spouse

</fieldset>
</div>


<div id="widow" style="visibility:hidden;display:none;">
<fieldset>
<legend>Widow/er Information</legend>
Sorry she is dead</fieldset>
</div>
========================================================================

thanks for everybody's help!!!

Chronoforms Rocks, and the book Chronoforms 1.3 for Joomla site Cookbook has a lots of great samples.

The only real problem here is my knowledge and my poor English....
GreyHead 03 Nov, 2010
Hi frediutah,

I think the basic problem here it that you can't reliably hide or display individual options in an option list. (You could do it with Option Groups but that's not the best solution here.) Instead use a radio button array. I think that your code will then work OK.

Bob

PS I'd move all of that script out of the select box and add an onClick event

PPS I think it maybe should be 'filing' rather than 'filling'??
This topic is locked and no more replies can be posted.