PDA

View Full Version : hide/show values are retained even after checkboxes put back as hidden... need DOM??

adr6699
06-17-2009, 08:46 PM
Hi, All:

I am not a javascript guy, and I'm having this problem with this "hide/Show" js code. The problem is, that the entries I make into the checkboxes, which appear on demand as user clicks options, some of the "checks" retain their values even if they are put back as "hidden". I assume, cause checkboxes-code still actually "there" in page, as opposed to literally being "added" or "removed' from page. So I guess it needs to be done tru JS-DOM and not just regular JS. So, how can I modify the current hide/show javascript into DOM?? or am I all wrong here??

Appreciate any help...



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
.color-table {
background-color: #FFFF99;
}
.color-table-2 {
background-color: #FFCCCC;
}
.style3 {font-size: 18px; font-weight: bold; color: #CC0000; }
.style5 {
font-size: 20px;
font-weight: bold;
}
-->
</style>
</head>

<body>


<script type="text/javascript">
<!--
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'none')
e.style.display = 'block';
else
e.style.display = 'none';
}
//-->
</script>

<script type="text/javascript">
<!--
function toggle_visibilityNone(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'none';
}
//-->
</script>



<script type="text/javascript">
<!--
function toggle_visibilityYes(id) {
var e = document.getElementById(id);
if(e.style.display == 'none')
e.style.display = 'block';
else
e.style.display = 'block';
}
//-->
</script>


<form action="<?php echo $editFormAction; ?>" id="insertForm" name="insertForm" method="POST">
<p>&nbsp;</p>
<table width="375" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3" align="center"><img src="../images/nc_title_logo.gif" width="342" height="54" /></td>
</tr>
<tr>
<td colspan="3">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td colspan="2" align="center">&nbsp;</td>
</tr>
<tr>
<td width="314"><span class="style5">No Order completed in this call </span></td>
<td width="61" colspan="2" align="center">
<input name="noorder" type="checkbox" id="noorder" value="checkbox" onclick="toggle_visibility('box');" /> </td>
</tr>
<tr>
<td colspan="3">&nbsp;</td>
</tr>
<tr>
<td colspan="3"><div id="box">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr class="color-table">
<td >&nbsp; </td>
<td align="left">&nbsp;</td>
<td align="left">&nbsp;</td>
</tr>
<tr class="color-table">
<td >&nbsp;</td>
<td align="left"><strong>YES</strong></td>
<td align="left"><strong>NO</strong></td>
</tr>
<tr>
<td width="80%" class="color-table">&nbsp;&nbsp;1) Did you attempt an Upsell?</td>
<td class="color-table"><input type="radio" name="upsell" value="Y" onclick="toggle_visibilityYes('upsellBox');"/></td>
<td align="center" class="color-table"><input type="radio" name="upsell" value="N" onclick="toggle_visibilityNone('upsellBox');"/></td>
</tr>
</table></td>
</tr>
<tr>
<td class="color-table">&nbsp;</td>
</tr>
<tr>
<td class="color-table"><div id="upsellBox">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="80%" class="color-table">&nbsp;&nbsp;2) Was the Upsell successful? </td>
<td class="color-table"><input type="radio" name="upsellStatus" value="Y" /></td>
<td align="center" class="color-table"><input type="radio" name="upsellStatus" value="N" /></td>
</tr>
<tr>
<td class="color-table">&nbsp;</td>
<td class="color-table">&nbsp;</td>
<td align="center" class="color-table">&nbsp;</td>
</tr>
</table>
</div></td>
</tr>
<tr>
<td class="color-table-2">&nbsp;</td>
</tr>
<tr>
<td class="color-table-2"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="color-table-2">&nbsp;</td>
<td align="left" class="color-table-2"><strong>YES</strong></td>
<td colspan="2" align="left" class="color-table-2"><strong>NO</strong></td>
</tr>
<tr>
<td width="80%" class="color-table-2">&nbsp;&nbsp;3) Did you attempt a Cross-Sell? </td>
<td class="color-table-2"><input type="radio" name="cross" value="Y" onclick="toggle_visibilityYes('crossBox');"/></td>
<td colspan="2" align="center" class="color-table-2"><input type="radio" name="cross" value="N" onclick="toggle_visibilityNone('crossBox');"/></td>
</tr>
</table></td>
</tr>
<tr>
<td class="color-table-2">&nbsp;</td>
</tr>
<tr>
<td><div id="crossBox">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="80%" class="color-table-2">&nbsp;&nbsp;4) Was the Cross-Sell successful? </td>
<td class="color-table-2"><input type="radio" name="crossStatus" value="Y" /></td>
<td align="center" class="color-table-2"><input type="radio" name="crossStatus" value="N" /></td>
</tr>
<tr>
<td class="color-table-2">&nbsp;</td>
<td class="color-table-2">&nbsp;</td>
<td align="center" class="color-table-2">&nbsp;</td>
</tr>
</table>
</div></td>
</tr>
</table>
</div> </td>
</tr>
<tr>
<td>&nbsp;</td>
<td colspan="2" align="center">&nbsp;</td>
</tr>
<tr>
<td><input name="agentid" type="hidden" id="agentid" value="<?php echo $_GET['agentid']; ?>" />
<input name="first" type="hidden" id="first" value="<?php echo $_GET['first']; ?>" />
<input name="last" type="hidden" id="last" value="<?php echo $_GET['last']; ?>" />
<input name="startdate" type="hidden" id="startdate" value="<?php


$newdate = $_GET['startdate'];
$newdateMonth = substr($newdate,0,2);
$newdateDay = substr($newdate,2,2);
$newdateYear = substr($newdate,4,4);
$newFinalDate = $newdateYear . "-" . $newdateMonth . "-" . $newdateDay;
echo $newFinalDate;



?>" />
<input name="inqueue" type="hidden" id="inqueue" value="<?php echo $_GET['inqueue']; ?>" />
<input name="skill" type="hidden" id="skill" value="<?php echo $_GET['skill']; ?>" />
<input name="skillname" type="hidden" id="skillname" value="<?php echo $_GET['skillname']; ?>" />
<input name="contactid" type="hidden" id="contactid" value="<?php echo $_GET['contactid']; ?>" />
<input name="masterid" type="hidden" id="masterid" value="<?php echo $_GET['masterid']; ?>" />
<input name="dnis" type="hidden" id="dnis" value="<?php echo $_GET['dnis']; ?>" />
<input name="ani" type="hidden" id="ani" value="<?php echo $_GET['ani']; ?>" />
</td>
<td colspan="2" align="center"><input type="submit" name="Submit" value="Submit" /></td>
</tr>
</table>

<input type="hidden" name="MM_insert" value="insertForm">
</form>
<p>&nbsp;</p>
</body>
</html>
celsoendo
06-27-2009, 11:14 PM
The form doesn't submit a field value on 2 situations:

1) The field is outside <form> and </form>
2) The field is disabled

To disable a field dinamically you can do something like this


<form method="post" action="">
<input type="checkbox" name="disablefield" id="disablefield" value="1" onclick="document.getElementById('myname').disabled = this.checked;" /> Disable/Enable the field below<br />
Name: <input type="text" name="myname" id="myname" /><br />
<input type="submit" value="go" />
</form>


If the field "Name" is disabled it won't be submitted.

Got it? :thumbsup: