www.webdeveloper.com
Results 1 to 3 of 3

Thread: make form fields available depending on user input

  1. #1
    Join Date
    Nov 2005
    Posts
    6

    make form fields available depending on user input

    Don't know what all is available to do this in (javascript, etc) so I am putting the question here.

    I have a form, when a user selcts a radio button such as credit card, check, or PO, certain fields should be available according to which one they select. How do I do this and in what platform?

  2. #2
    Join Date
    Jun 2005
    Location
    United Kingdom
    Posts
    1,043
    You can do this either with javascript (but using that would create an accessibility problem - and many browsers will have it turned of, anyway) or you can use a server side language such as php, and have a series of pages that display in accordance with the preceding on - you often see that in online shopping. It does mean loading of separate pages, but they should load quite quickly.

  3. #3
    Join Date
    Dec 2005
    Location
    Arizona
    Posts
    29
    What you need to do is place all fields, depending on what the user selects, within <div>. In other words, use CSS.

    Here is a quick example of what you can do:

    <form id="form1" name="form1" method="post" action="">
    <label>Credit Card</label>
    <input name="radiobutton" type="radio" value="radiobutton" onclick="credit.style.display=''; check.style.display='none'" /><br />
    <label>Check</label>
    <input name="radiobutton" type="radio" value="radiobutton" onclick="credit.style.display='none'; check.style.display=''"/><br />
    <div id="credit" style="display:none">
    <label>Card Number</label>
    <input name="creditNumber" type="text" />
    </div>
    <div id="check" style="display:none">
    <label>Check Routing</label>
    <input name="checkRouting" type="text" />
    </div>
    </form>
    Don't box me in; let me surf.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles