Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > PHP/MySQL > PHP How-To
Password Reminder
Register
| FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
PHP How-To Post your "How do I do this with PHP?" questions here.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the PHP How-To section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developers’ questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Search this Thread Display Modes
  #1 (permalink)  
Old January 30th, 2007, 12:02 AM
Registered User
 
Join Date: Jan 2007
Location: Tinton Falls, New Jersey, USA.
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Default form with conditional questions

I'm trying to code a form with additional conditional questions based on answers that were given in two prior questions, I've been working with layers, and thought that I had it done, but then realized that I have to not only suppress the questions that should not be visible, but also need to delete the space that those layers would otherwise take up on the form. I tried to accomplish this using css, but obviously don't have the necessary skill set to do it correctly. I would appreciate it is someone could give me an idea of what I'm doing wrong.

Here is my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<STYLE TYPE="text/css">
.forminput {
display: none;
}
</style>

<script type="text/javascript">
function updateQuestions() {
    q1=document.getElementById('q1_y').checked;
    q2=document.getElementById('q2_y').checked;

    // first, disable all elements or they will get 'stuck'
    for (x=3;x<=10;x++) {
        (document.getElementById('q' + x).style.display == 'block')
        document.getElementById('q' + x).style.display = 'none';;
    }

    if (q1 && !q2) {
        for (x=3;x<=10;x++) {
            (document.getElementById('q' + x).style.display == 'block')
            document.getElementById('q' + x).style.display = 'none';
        }
    } else if (q1 && q2) {
        for (x=3;x<=10;x++) {
            if (x!=9) {
                (document.getElementById('q' + x).style.display == 'block')
                document.getElementById('q' + x).style.display = 'none';
            }
        }
    } else if (!q1 && q2) {
        for (x=3;x<=10;x++) {
            if (x!=8&&x!=9) {
                (document.getElementById('q' + x).style.display == 'block')
                document.getElementById('q' + x).style.display = 'none';
            }
        }
    } else if (!q1 && !q2) {
        for (x=3;x<=10;x++) {
            if (x!=7&&x!=8&&x!=9) {
                (document.getElementById('q' + x).style.display == 'block')
                document.getElementById('q' + x).style.display = 'none';
            }
        }
    } else document.getElementById('q' + x).style.display = 'block';
}
</script>
</head>

<body>
<form id="form1" method="post" action="">
<p>Question 1</p>
<p>
<input id="q1_y" name="q1" type="radio" value="yes" onclick="updateQuestions()">
<input id="q1_n" name="q1" type="radio" value="no" onclick="updateQuestions()">
</p>

<p>Question 2 </p>
<p>
<input id="q2_y" name="q2" type="radio" value="yes" onclick="updateQuestions()">
<input id="q2_n" name="q2" type="radio" value="no" onclick="updateQuestions()">
</p>

<div id="q3" class='forminput'>
<p>Question 3 </p>
<p>
<input id="q3_y" type="radio" value="yes">
<input id="q3_n" type="radio" value="no">
</p>
</div>

<div id="q4" class='forminput'>
<p>Question 4 </p>
<p>
<input id="q4_y" type="radio" value="yes">
<input id="q4_n" type="radio" value="no">
</p>
</div>

<div id="q5" class='forminput'>
<p>Question 5 </p>
<p>
<input id="q5_y" type="radio" value="yes">
<input id="q5_n" type="radio" value="no">
</p>
</div>

<div id="q6" class='forminput'>
<p>Question 6 </p>
<p>
<input id="q6_y" type="radio" value="yes">
<input id="q6_n" type="radio" value="no">
</p>
</div>

<div id="q7" class='forminput'>
<p>Question 7 </p>
<p>
<input id="q7_y" type="radio" value="yes">
<input id="q7_n" type="radio" value="no">
</p>
</div>

<div id="q8" class='forminput'>
<p>Question 8 </p>
<p>
<input id="q8_y" type="radio" value="yes">
<input id="q8_n" type="radio" value="no">
</p>
</div>

<div id="q9" class='forminput'>
<p>Question 9 </p>
<p>
<input id="q9_y" type="radio" value="yes">
<input id="q9_n" type="radio" value="no">
</p>
</div>

<div id="q10" class='forminput'>
<p>Question 10 </p>
<p>
<input id="q10_y" type="radio" value="yes">
<input id="q10_n" type="radio" value="no">
</p>
</div>

<input id="submit" type="submit" value="Submit">
</form>

</body>
</html>

Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Form email Questions John10Yes ASP.NET 2.0 Basics 4 September 15th, 2006 10:58 AM
Access Form Questions sario777 Access 2 April 12th, 2005 06:38 PM
Javascript Form Questions The_Jackal Javascript How-To 0 August 24th, 2004 12:50 PM
conditional form submission moushumi Classic ASP Basics 1 March 30th, 2004 08:12 AM
Form validation & conditional return confirmation GMiles1972 Javascript How-To 3 February 3rd, 2004 11:31 AM



All times are GMT -4. The time now is 10:21 PM.


Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.