Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4

Thread: Please help..

  1. #1
    Junior Member Base742's Avatar
    Join Date
    May 2013
    Posts
    4
    Member #
    36375
    I'm making a form and I want it to not show the contact time radio buttons unless they select "yes" on the contact time radio buttons.... and then i want it to show other with a text box next to it only if they select other, in the select time radio buttons. As well as making the box required when needed, and the contact time required if they select the yes radio button before that. Please help ... here is the code....


    HTML Code:
    <form action="[URL]http://www.myurl.com/pages/formmail2.php[/URL]" onsubmit="return confirm('Are you sure you want to submit?')" method="post" enctype="multipart/form-data" name="SampleForm">
    <input name="good_url" type="hidden" value="thankyou.html" />
    <input type="hidden" name="env_report" value="REMOTE_HOST,REMOTE_ADDR,HTTP_USER_AGENT,AUTH_TYPE,REMOTE_USER" />
     
    <input name="recipients" type="hidden" value="mail" />
     
    <input type="hidden" name="required" value="Website:Website, FullName:Your Name, EmailAddr:Email Address, browser:Browser, ContactTime:Contact Time, Rate: Rating of Website, Navrate: Rating of Navigation, Navease: Ease of Navigation" />
     
     
    <input type="hidden" name="subject" value="Contact Web Designer Form Submission" />
     
    <input type="hidden" name="derive_fields" value="email=EmailAddr,realname=FullName" />
     
    <input type="hidden" name="mail_options" value="Exclude=email;realname" />
     
    <input type="hidden" name="Website" value="CCNLL" />
     
    <table width="767" border="1" align="center" cellspacing="1">
    <tr>
    <td width="431" align="left">
    <p><strong>*</strong> Please enter your name:</p>
    </td>
    <td width="317" align="left"><input name="FullName" type="text" size="45" />
    </td>
    </tr>
    <tr>
    <td height="45" align="left">
    <p><strong>*</strong> Please enter your email address:</p>
    </td>
    <td align="left"><input name="EmailAddr" type="text" size="45" />
    </td>
    </tr>
    <tr>
    <td height="62" align="left"><p>May I contact you?</p>
    </td>
    <td align="left">
    <input type="radio" name="contact" value="Yes" checked="checked" />
    Yes <br />
    <input type="radio" name="contact" value="No" />
    No </td>
    </tr>
    <tr>
    <td height="172" align="left"><p><strong>*</strong> When may I contact you?</p></td>
    <td align="left">
    <input type="checkbox" name="ContactTime[]" value="Morning (7am-12pm)" /> Morning (7am-12pm) <br />
    <input type="checkbox" name="ContactTime[]" value="Afternoon (12pm-6pm)" /> Afternoon (12pm-6pm) <br />
    <input type="checkbox" name="ContactTime[]" value="Night (6pm-10pm)" /> Night (6pm-10pm) <br />
    <input type="checkbox" name="ContactTime[]" value="Anytime" /> Anytime<br />
    <input type="checkbox" name="ContactTime[]" value="Other" /> Other <br />
    If Other:<input name="other time" type="text" size="25" />
    </td>
    </tr>
    <tr>
    <td height="43" colspan="2" align="center" valign="middle"><strong>Please Answer the Following Questions</strong></td>
    </tr>
    <tr>
    <td height="48" align="left"><p><strong>*</strong>What browser are you using? <br />
    <span class="resourcetable">Including but not limited to:
    Internet Explorer, Aol, and Chrome</span></p></td>
    <td align="left"><input type="text" name="browser" size="45" id="browsertype" /></td>
    </tr>
    <tr>
    <td height="169" align="left" valign="middle"><p><strong>*</strong> How would you rate this site?</p></td>
    <td align="left">
    <input type="radio" name="Rate" value="Excellent" /> Excellent<br />
    <input type="radio" name="Rate" id="radio" value="Good" /> Good<br />
    <input type="radio" name="Rate" id="Ok" value="Ok" /> Ok<br />
    <input type="radio" name="Rate" id="needs improvement" value="Needs Improvement" /> Needs Improvement<br />
    <input type="radio" name="Rate" id="bad" value="Bad" /> Bad<br />
    <input type="radio" name="Rate" id="sucks" value="Sucks" />
    Sucks</td>
    </tr>
    <tr>
    <td height="180" align="left" valign="middle"><p><strong>*</strong> How is the navigation?</p></td>
    <td align="left">
    <input type="radio" name="Navrate" value="Excellent" /> Excellent<br />
    <input type="radio" name="Navrate" id="radio" value="Good" /> Good<br />
    <input type="radio" name="Navrate" id="Ok" value="Ok" /> Ok<br />
    <input type="radio" name="Navrate" id="needs improvement" value="Needs Improvement" /> Needs Improvement<br />
    <input type="radio" name="Navrate" id="bad" value="Bad" /> Bad<br />
    <input type="radio" name="Navrate" id="nonav" value="Can't Navigate" /> Not Able to Navigate
    </td>
    </tr>
    <tr>
    <td height="88" align="left" valign="middle"><p><strong>*</strong>Navigation Ease of use:</p></td>
    <td align="left">
    <input type="radio" name="Navease" value="Easy"/> Easy<br />
    <input type="radio" name="Navease" value="Medium" /> Medium<br />
    <input type="radio" name="Navease" value="Hard" /> Hard
    </td>
    </tr>
    <tr>
    <td align="left" valign="middle">
    <p>Comments, Suggestions and Concerns:</p>
    </td>
    <td align="left">
    <textarea name="Comments" cols="50" rows="10" id="mesg"></textarea>
    </td>
    </tr>
    <tr>
    <td colspan="2">
    <input type="submit" value="Submit" />
    <input type="reset" value="Reset" />
    </td>
    </tr>
    </table>
    <p>&nbsp;</p>
    </form>

  2.  

  3. #2
    Senior Member RDesignista's Avatar
    Join Date
    Feb 2012
    Location
    Coconut Tree City
    Posts
    822
    Member #
    30921
    Liked
    123 times
    Base742,

    You'll need a bit of IF-THEN with javscript. I personally don't know javascript, so let me share with you something I had for a form for a client.

    The following code reads like this: IF they choose the radio value "Joint" for the input "loan-type2", THEN #coapp-box and #joint-app-note are revealed. Otherwise, #coapp-box and #joint-app-note will be hidden.

    You would put this above </body>. It requires jquery to be included. Please click on this link if you want to see the actual form I made.

    Code:
    <script>
    // loan type is joint, then show additional box 
    jQuery(function(){
            jQuery("input[name=loan-type2]").change(function(){          
                
                
                if ($(this).val() == "Joint") {
                $("#coapp-box , #joint-app-note").slideDown();
                }
                else {
                $("#coapp-box , #joint-app-note").slideUp();
                }                                                            
           });
    });
    </script>

  4. #3
    Senior Member RDesignista's Avatar
    Join Date
    Feb 2012
    Location
    Coconut Tree City
    Posts
    822
    Member #
    30921
    Liked
    123 times
    Oh, and since you seem to be kind of new to the web design game, you should put this code in your <head> section to download the jquery library:

    <script src="http://ajax.googleapis.com/ajax/libs.../jquery.min.js" ></script>

    Jquery is just a javascript framework/library. Jquery makes it easier to use javascript functions. Don't worry about it all means, just know that a majority of sites out there use jquery to make cool effects and for functions. In this case, we need jquery for the IF THEN statement. AND BE SURE TO PUT QUOTES AROUND STRINGS OR NAMES OF DIVS. Unlike css or html, in programming languages, if you don't put quotes around certain things like string data, it won't work.

  5. #4
    Junior Member Base742's Avatar
    Join Date
    May 2013
    Posts
    4
    Member #
    36375
    Quote Originally Posted by RDesignista, post: 251515, member: 30952
    Oh, and since you seem to be kind of new to the web design game, you should put this code in your <head> section to download the jquery library:

    <script src="http://ajax.googleapis.com/ajax/libs.../jquery.min.js" ></script>

    Jquery is just a javascript framework/library. Jquery makes it easier to use javascript functions. Don't worry about it all means, just know that a majority of sites out there use jquery to make cool effects and for functions. In this case, we need jquery for the IF THEN statement. AND BE SURE TO PUT QUOTES AROUND STRINGS OR NAMES OF DIVS. Unlike css or html, in programming languages, if you don't put quotes around certain things like string data, it won't work.
    See... i know to do that... but it really doesnt make it difference it seems. Because i tested it without that link and it works still. But i added it just in case. And im doing all this, to learn a bit more about different things. Thank you for helping. Now how would i make it required when yes is selected and not required when no is selected? another IF-THEN statement? I mean i know a bit about it and im trying to think how it would be that but the coding is not coming to mind. Hard to explain....


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:37 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com