Could someone explain how to solve the following problem?
I'm using a dynamic form and CSS-Positioning to prompt a user to respond to an initial and a follow-up question. This dynamic swapping of the follow-up question works fine, and I can get the outside value ("show") to be submited, but I cannot get the inside value ("character") to be submitted with the form!
Code explanation: the user is prompted for their favorite Star Trek series character (chosen from a drop-down select box). There are 3 choices, with the first 2 (ST anf NG) resulting in drop-down/select box follow-up questions, and the 3rd (OT) resulting in an input box follow-up question where the user types their character's name. Once they have selected or typed in their favorite character, the user submits the form. Here's some sample code:
<?php
...
include 'header.php';
...
...(javascript functions to switch between the <div> sections and make their visibility "hidden" or "visible": switchDiv(div_id), hideAll(), etc )...
...
What is your favorite Star Trek series character? (select show from the drop down, then select or type your character's name)<br>
<input type="hidden" name="show" value=http://www.webdeveloper.com/forum/archive/index.php/"$favoriteshow" >
<select name="show" onchange="show.value = this.options[this.selectedIndex].value; switchDiv( this.options[this.selectedIndex].value);" >
<option value="ST" >Star Trek - Original</option>
<option value="NG" >Star Trek - Next Generation</option>
<option value="OT" >Star Trek - other show (Voyager, Enterprise, etc)</option>
</select >
<!-- begin main CSS-P section -->
<div style="position: relative;" >
<!-- select box for Star Trek - Original -->
<div id="ST" style="visibility: hidden; position: absolute;" >
Select your favorite character:<br>
<input type="hidden" name="character" value="$favoritechar" >
<select name="show" onchange="character.value = this.options[this.selectedIndex].value;" >
<option value="A1" >Capt. Kirk</option>
<option value="A2" >Mr. Spock</option>
<option value="A3" >Jim</option>
</select >
</div >
<!-- select box for Star Trek - Next Generation -->
<div id="NG" style="visibility: hidden; position: absolute;" >
Select your favorite character:<br>
<input type="hidden" name="character" value="$favoritechar" >
<select name="show" onchange="character.value = this.options[this.selectedIndex].value;" >
<option value="B1" >Capt. Piccard</option>
<option value="B2" >Ryker</option>
<option value="B3" >Worf</option>
</select >
</div >
<!-- input text box for other Star Trek shows (Deep Space 9, Voyager, Enterprise, etc) -->
<div id="OT" style="visibility: hidden; position: absolute;" >
Type your favorite character:<br>
<input name="character" width="40" >
</div >
<!-- end main CSS-P section -->
</div >
<form name="favorites" action="favorite.php" method="post">
<input type="submit" value="submit">
...
include'footer.php';
?>
I'm using a dynamic form and CSS-Positioning to prompt a user to respond to an initial and a follow-up question. This dynamic swapping of the follow-up question works fine, and I can get the outside value ("show") to be submited, but I cannot get the inside value ("character") to be submitted with the form!
Code explanation: the user is prompted for their favorite Star Trek series character (chosen from a drop-down select box). There are 3 choices, with the first 2 (ST anf NG) resulting in drop-down/select box follow-up questions, and the 3rd (OT) resulting in an input box follow-up question where the user types their character's name. Once they have selected or typed in their favorite character, the user submits the form. Here's some sample code:
<?php
...
include 'header.php';
...
...(javascript functions to switch between the <div> sections and make their visibility "hidden" or "visible": switchDiv(div_id), hideAll(), etc )...
...
What is your favorite Star Trek series character? (select show from the drop down, then select or type your character's name)<br>
<input type="hidden" name="show" value=http://www.webdeveloper.com/forum/archive/index.php/"$favoriteshow" >
<select name="show" onchange="show.value = this.options[this.selectedIndex].value; switchDiv( this.options[this.selectedIndex].value);" >
<option value="ST" >Star Trek - Original</option>
<option value="NG" >Star Trek - Next Generation</option>
<option value="OT" >Star Trek - other show (Voyager, Enterprise, etc)</option>
</select >
<!-- begin main CSS-P section -->
<div style="position: relative;" >
<!-- select box for Star Trek - Original -->
<div id="ST" style="visibility: hidden; position: absolute;" >
Select your favorite character:<br>
<input type="hidden" name="character" value="$favoritechar" >
<select name="show" onchange="character.value = this.options[this.selectedIndex].value;" >
<option value="A1" >Capt. Kirk</option>
<option value="A2" >Mr. Spock</option>
<option value="A3" >Jim</option>
</select >
</div >
<!-- select box for Star Trek - Next Generation -->
<div id="NG" style="visibility: hidden; position: absolute;" >
Select your favorite character:<br>
<input type="hidden" name="character" value="$favoritechar" >
<select name="show" onchange="character.value = this.options[this.selectedIndex].value;" >
<option value="B1" >Capt. Piccard</option>
<option value="B2" >Ryker</option>
<option value="B3" >Worf</option>
</select >
</div >
<!-- input text box for other Star Trek shows (Deep Space 9, Voyager, Enterprise, etc) -->
<div id="OT" style="visibility: hidden; position: absolute;" >
Type your favorite character:<br>
<input name="character" width="40" >
</div >
<!-- end main CSS-P section -->
</div >
<form name="favorites" action="favorite.php" method="post">
<input type="submit" value="submit">
...
include'footer.php';
?>