Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Sep 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Lightbulb radio button activate field

    go here:

    http://qodeplay.com/javascript



    help me accomplish this and send this data to a mysql column!



    note: the field will not grey out in ie.

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,760
    Thanks
    55
    Thanked 516 Times in 513 Posts
    the totally minimalist version?

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>
    <body>
    Do you have an account with us already?
    <input name="myrad" type="radio" value="" onclick="javascript:getElementById('txtfld').disabled=false"/>Yes <input name="myrad" type="radio" value="" />No<br /><br />
    <i>If yes, enter your global account number.</i><br />
    <i>If no, the field should grey out.</i>
    <br /><br />Global Account Number:<input id="txtfld" type="text" disabled="disabled"/>
    </body>
    </html>

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    Ummm...no, that won't work.

    For one gloriously simple reason.

    He says he wants to send the info to a MySQL database, right?

    So that means that he needs a *FORM* that contains those fields, so that he can SUBMIT that form.

    But then the field <input id="txtfld"> will *NEVER* be sent to MySQL.

    Because *ONLY* fields with NAMES are sent by HTML to the server.

    In other words, change id="txtfld" to name="txtfld"

    But there are other things wrong with the code. For starters, if the user clicks on the YES button first, the field is enabled. But if he then clicks on NO, the field *stays* enabled.

    Also, presumably the PHP (or other server-side code) would like to *KNOW* which radio button was selected, so they each really need to have a value.

    Code:
    <body>
    <form action="...some PHP page..." method="post" >
    Do you have an account with us already?
    <label><input name="hasAccount" type="radio" value="yes"
           onclick="this.form.accountID.disabled=false;"/> Yes</label>
    <label><input name="hasAccount" type="radio" value="no" checked
           onclick="this.form.accountID.disabled=true;"/> No</label>
    <i>If yes, enter your global account number.</i><br />
    <i>If no, the field should grey out.</i>
    <br /><br />
    Global Account Number:<input name="accountID" disabled="disabled"/>
    ...
    ... other fields in the form ...
    <input type="submit" value="Submit for processing" />
    </form>
    </body>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    Personally, I would have simply hidden the entire account number entry until/unless YES was checked.

    Thus:
    Code:
    <body>
    <form action="...some PHP page..." method="post" >
    Do you have an account with us already?
    <label><input name="hasAccount" type="radio" value="yes"
           onclick="document.getElementById("ACCT").style.display='block';"/> Yes</label>
    <label><input name="hasAccount" type="radio" value="no" checked
           onclick="document.getElementById("ACCT").style.display='none';"/> No</label>
    <br /><br />
    <div id="ACCT">
        Please enter your Global Account Number:<input name="accountID"/>
    </div>
    ...
    ... other fields in the form ...
    <input type="submit" value="Submit for processing" />
    </form>
    </body>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Tags for this Thread

    Posting Permissions

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