spock9458

I have a rather complicated event registration form that uses javascript to show or hide certain tables depending on radio button selections entered by users. There are basically three types of registrations: Member, Exhibitor and Partial. The script I'm using works fine to show only certain additional tables for the type of registration selected. Here is the successful script: <script> var radio; var attendValue = document.getElementsByName("rad_attend").value; function checkAttend(attendValue) { switch(attendValue) { case "1": document.getElementById("hideshow1").style.display = 'block'; document.getElementById("hideshow2").style.display = 'none'; document.getElementById("hideshow3").style.display = 'none'; break; case "2": document.getElementById("hideshow2").style.display = 'block'; document.getElementById("hideshow1").style.display = 'none'; document.getElementById("hideshow3").style.display = 'none'; break; case "3": document.getElementById("hideshow3").style.display = 'block'; document.getElementById("hideshow1").style.display = 'none'; document.getElementById("hideshow2").style.display = 'none'; break; default: document.getElementById("hideshow1").style.display = 'none'; document.getElementById("hideshow2").style.display = 'none'; document.getElementById("hideshow3").style.display = 'none'; } } </script> The script is "fired" with these radios: <td align='right'><input type='radio' name='rad_attend' value='1' onchange='UpdateTotal(true); checkAttend(this.value);' /></td> <td align='right'><input type='radio' name='rad_attend' value='2' onchange='UpdateTotal(true); checkAttend(this.value);' /></td> <td align='right'><input type='radio' name='rad_attend' value='3' onchange='UpdateTotal(true); checkAttend(this.value);' /></td> Like I said this script and functionality are all working properly. Then they asked me to add the ability for a Member registration to include additional guests, so I created three additional tables for collecting the additional information, and I am trying to use the same type of script as above in order to show either 1, 2, or 3 of the additional tables depending on the radio button selection chosen by the User. Here is the javascript I am using for this function: <script> var radio; var numAdditional = document.getElementsByName("rad_number_addl_guests").value; function checkAdditional(numAdditional) { switch(numAdditional) { case "1": document.getElementById("additionalguest1").style.display = 'block'; document.getElementById("additionalguest2").style.display = 'none'; document.getElementById("additionalguest3").style.display = 'none'; break; case "2": document.getElementById("additionalguest1").style.display = 'block'; document.getElementById("additionalguest2").style.display = 'block'; document.getElementById("additionalguest3").style.display = 'none'; break; case "3": document.getElementById("additionalguest1").style.display = 'block'; document.getElementById("additionalguest2").style.display = 'block'; document.getElementById("additionalguest2").style.display = 'block'; break; default: document.getElementById("additionalguest1").style.display = 'none'; document.getElementById("additionalguest2").style.display = 'none'; document.getElementById("additionalguest3").style.display = 'none'; } } </script> And here are the radio buttons that are supposed to fire that script: <td colspan='3'> <span class='olr-label'>How many additional guests are you brining?: <input type='radio' name='rad_number_addl_guests' value='1' onchange='checkAdditional(this.value);' /> 1 <input type='radio' name='rad_number_addl_guests' value='2' onchange='checkAdditional(this.value);' /> 2 <input type='radio' name='rad_number_addl_guests' value='3' onchange='checkAdditional(this.value);' /> 3 </span> </td> This script is not working at all. Nothing happens when either of the buttons are selected, and I must be missing something simple because it works in one situation but not in the other. I am hoping another set of eyes with more experience coding can help me figure out what is wrong with my second script. Any clues would be appreciated. Thanks.

OK, here are some more details: The existing function used for the "onchange" assigned to the radio buttons is: onchange = 'UpdateTotal(True);' Here is the script code I am trying so far: <script> function checkRadios(rad_attend) { switch(rad_attend) { case 1: document.getElementById("hideshow1").style.display = 'block'; break; case 2: document.getElementById("hideshow2").style.display = 'block'; break; case 3: document.getElementById("hideshow3").style.display = 'block'; default: document.getElementById("hideshow1, hideshow2, hideshow3").style.display = 'none'; } } </script> And the code (partial) in the body of the HTML is here: <legend> Attendance Options </legend> <table border='0' cellspacing='0' cellpadding='4'> <tbody> <tr> <th align='left'>Option</th> <th align='left'>Price </th> <th align='right'>Select</th> </tr> <tr> <td>Member Registration</td> <td align='left'>$<span id='aprice1'>450</span></td> <td align='right'><input type='radio' name='rad_attend' value='1' onchange='UpdateTotal(true); checkRadios(rad_attend);' /></td> </tr> <tr id="hideshow1" style="display:none;"> <td>Member - Golf Tournament</td> <td align='left'>$<span id='mprice6'>150</span></td> <td align='right'><input type='checkbox' value='' name='chk_mqty6' onchange='UpdateTotal(true);' /></td> </tr> <tr id="hideshow1" style="display:none;"> <td>Member - Wine and Watercolor</td> <td align='left'>$<span id='mprice8'>45</span></td> <td align='right'><input type='checkbox' value='' name='chk_mqty8' onchange='UpdateTotal(true);' /></td> </tr> <tr> <td>Exhibitor Registration</td> <td align='left'>$<span id='aprice2'>1000</span></td> <td align='right'><input type='radio' name='rad_attend' value='2' onchange='UpdateTotal(true);' /></td> </tr> <tr> <td>Guest Only</td> <td align='left'>$<span id='aprice3'>0</span></td> <td align='right'><input type='radio' name='rad_attend' value='3' onchange='UpdateTotal(true);' /></td> </tr> On loading the page, the behavior is fine: None of the radio buttons are selected, and the rows with the id="hideshow1" are hidden. However, when I click on the Member radio button (value=1) nothing happens to the table rows that are supposed to be revealed. Please note that my code is not complete - I plan on adding additional "hidden" rows with id="hideshow2" and "hideshow3" for the other registration options, I just want to get the "reveal" function working first. I feel like I'm missing something pretty basic, so please advise where I'm going wrong. Thanks again.

I am pretty new to Javascript, but I think it is what I need to build the functions I want into my form. I am working with a registration system that was written by someone else, that works for my needs but I want to add logic to it. The system creates an HTML page with all of the form elements I need, in a table format. Basically there are three options for my registrants to select from, in the form of radio buttons. The name of the radio button set is "rad_attend", and the available values are "1", "2" or "3". What I want to do is have the optional table rows associated with each "attend" value to be hidden initially, and only appear when the radio button is selected. In the code there is another function tied to the "onchange" condition of the radio button - it adds the registration price to a running total calculated by the existing script. So, I need a way to have the "onchange" condition fire the additional function of showing the related table rows that I want available when that radio button is selected. I think it is possible to fire two separate functions with the "onchange" condition of the radio button, but I'm getting confused as to how to handle the three options I want to "reveal" depending on the choice of the attendance buttons. To illustrate, let's call my attendance options: "Member", "Exhibitor", and "Guest". When the page loads initially, no option is selected. When the registrant chooses "Member", I want certain table rows to be displayed - if possible using the "onchange" condition. Likewise, I want different table rows to be displayed when "Exhibitor" or "Guest" radios are selected. And, if someone selects "Member" and then changes to "Exhibitor", I need the Member optional rows to disappear ("display:none") and the Exhibitor optional rows to appear ("display:block"). So it seems like some kind of "toggle" function would work, according to the different Element IDs that I can assign to the various associated table rows, but I have not been successful in finding something that works with the three different options. If anyone has any suggestions, I would really appreciate the help. Thanks

Thanks everyone for your help and suggestions. I will take them to heart, and probably start over from the beginning with the newer version after studying a while. I appreciate you all trying to help me improve. Thanks!

I have to admit, I am a PHP NOVICE, and don't get that much practice. A few years ago I created some code that worked for my purpose, but now my server has upgraded PHP to version 5.3, and the old code won't work at all. Here is the old code that used to work: <?php // Connection to DB mysql_connect("server", "user", "password") or die('Cannot connect to the database because: ' . mysql_error()); mysql_select_db ("database"); // Retrieve all Region 6 Legislators from the "contact_info" table $result = mysql_query("SELECT * FROM contact_info WHERE branch = 'House' AND district = '11' ORDER BY district") or die(mysql_error()); // Start building the table for showing results using "while" loop echo "<table width='75%' border='0' cellpadding='10' cellspacing='0' bgcolor='#f0f0f0' style='margin-left:100px; margin-bottom:20px'>"; // Here is the "while" loop while($row = mysql_fetch_array( $result )) { // Print out the contents of each row into a table row echo "<tr valign='top'><td width='45%'><b>"; echo "House District: </b><font color='red'>",$row['district'],"</font><br>"; echo $row['first_name']," ",$row['last_name'],"<br>"; echo $row['address'],"<br>"; echo $row['csz'],"</td>"; echo "<td width='55%'><b>County(ies): </b><font color='red'>",$row['county'],"</font><br>"; echo "Capitol Phone: <font color='green'>",$row['cap_phone'],"</font><br>"; echo "Office Phone: <font color='green'>",$row['bus_phone'],"</font><br>"; echo "Home Phone: <font color='green'>",$row['home_phone'],"</font><br>"; echo "Email: <a href='mailto:",$row['email'],"'>",$row['email'],"</a></td></tr>"; } echo "</table>"; ?> So, I've been Googling and trying to adapt my code to the new version using some other scripts that I have updated, but I'm not having any luck at all. Here is the modified code I'm trying to use now, which does NOTHING. I have even tried to get it to print out the number of rows in my result, but it prints NOTHING. <?php // Connection to DB $mysqli = new mysqli("localhost", "user", "password", "database"); if($mysqli->connect_errno > 0){ die('Unable to connect to database [' . $db->connect_error . ']'); } // Retrieve all matching legislators $query = 'SELECT * FROM contact_info WHERE branch = 'House' AND district = '10' ORDER BY district'; $result = $mysqli->query($query) or die($mysqli->error.__LINE__); /* determine number of rows result set */ $row_cnt = mysqli_num_rows($result); echo "There are ",$row_cnt," rows in the result."; // Start building the table for showing results using "while" loop echo "<table width='75%' border='0' cellpadding='10' cellspacing='0' bgcolor='#f0f0f0' style='margin-left:100px; margin-bottom:20px'>"; // Here is the "while" loop while($row = $result->fetch_array(MYSQLI_ASSOC)) { // Print out the contents of each row into a table row echo "<tr valign='top'><td width='45%'><b>"; echo "House District: </b><font color='red'>",$row['district'],"</font><br>"; echo $row['first_name']," ",$row['last_name'],"<br>"; echo $row['address'],"<br>"; echo $row['csz'],"</td>"; echo "<td width='55%'><b>County(ies): </b><font color='red'>",$row['county'],"</font><br>"; echo "Capitol Phone: <font color='green'>",$row['cap_phone'],"</font><br>"; echo "Office Phone: <font color='green'>",$row['bus_phone'],"</font><br>"; echo "Home Phone: <font color='green'>",$row['home_phone'],"</font><br>"; echo "Email: <a href='mailto:",$row['email'],"'>",$row['email'],"</a></td></tr>"; } echo "</table>"; ?> I have a feeling that I'm missing a thing or two, or something I have in there is not correct. Any help will be so greatly appreciated. Thanks!