www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 17

Thread: Setting Value of Hidden Form Element

  1. #1
    Join Date
    Feb 2004
    Posts
    23

    Setting Value of Hidden Form Element

    Hey guys,

    I am new to Javascript and figured this would be the best place to post this question.
    I am trying to use Javascript to set the value of a hidden Form Element.

    I need to call the function on click of another element(radio button set).

    The radio button set has only two options.
    Whenever either is clicked i want to call the code to evaluate the condition and set the value of the hidden element.

    So the two questions are:

    1) where do i need to place my code in respect to the form HTML and how do i call the function from an element click.

    2) how do i set the value of the hidden form element. (the value content will be a URL)

    Hope this question isn't too stupid for this forum.
    Thanx alot,
    John

  2. #2
    Join Date
    Sep 2003
    Location
    Portsmouth, UK Occupation: Web Developer
    Posts
    2,602
    <input type="radio" name="hi" value="1" onclick="document.form.hiddenfield.value='23';">
    Richard Turner - A Virtual Insight

  3. #3
    Join Date
    Feb 2004
    Posts
    23

    wow

    man... would you ever laugh if you saw my attempted solution. i was WAY overworking myself. i suppose on something like this i should have expected a slightly simpler solution. thank you very much.

    ~John

  4. #4
    Join Date
    Feb 2004
    Posts
    23

    one more problem...

    that code generated no errors but i am not getting my desired result.

    The value of the hidden field is to be read by a cgi when the form is submitted. somehow the cgi is not picking up the value set onlclick of the radio button.

    however it does pick it up when i set it manually like
    <input type=hidden name="redirect" value="http://www.etc.com">.

    So the CGI picks up a value but not the one i am setting.

    (the cgi is a simple formmail)

    ~John

  5. #5
    Join Date
    Sep 2003
    Location
    Portsmouth, UK Occupation: Web Developer
    Posts
    2,602
    are you using this code

    <input type="radio" name="hi" value="1" onclick="document.form.hiddenfield.value='http://www.etc.com';">?

    should ov said b4 u need to change hiddenfield to redirect and form to your form name
    Richard Turner - A Virtual Insight

  6. #6
    Join Date
    Feb 2004
    Posts
    23

    yeah

    yeah i know. the form name and elementname are changed to match my form.

  7. #7
    Join Date
    Feb 2004
    Posts
    23

    perhaps...

    maybe i am missing something essential.
    do i have to have anything setup at the beginning of my document to define that i will be using javascript?
    is anything other java code needed in the entire document besides what u mentioned?

    ~JOhn

  8. #8
    Join Date
    Sep 2003
    Location
    Portsmouth, UK Occupation: Web Developer
    Posts
    2,602
    works fine

    <form name="form">
    <input type="radio" name="hi" value="1" onclick="document.form.hiddenfield.value='http://www.etc.com';">
    <input type="text" name="hiddenfield" size="10">
    </form>

    if that was changed to hiddenwould work too dont see whats wrong u got a link or complete page code?
    Richard Turner - A Virtual Insight

  9. #9
    Join Date
    Feb 2004
    Posts
    23

    i know

    i know the variables are being set by the code you gave.

    I made a button to check them after i clicked the radio buttons. it's very odd.

    I defined the hidden element with a default value of a URL.

    In my code i set the radio buttons.. one with an onclick event and the other without.

    When i submit my form if i have clicked the radio button with no onclick event then the redirect option of the CGI works as its supposed to. however if i use the radio button with the onclick event to change the hidden element value then the redirect does not work but rather is ignored by the cgi.

    all i can figure is that its a flaw or problem with the cgi. problem persists across browsers.

    egad. how annoying.

  10. #10
    Join Date
    Sep 2003
    Location
    Portsmouth, UK Occupation: Web Developer
    Posts
    2,602
    link or complete page code?
    Richard Turner - A Virtual Insight

  11. #11
    Join Date
    Feb 2004
    Posts
    23

    my complete page code

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

    <html>

    <head>
    <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
    <meta name="generator" content="Adobe GoLive">
    <title>Online Registration</title>
    <style type="text/css" media="screen"><!--
    @font-face { font-family: Optima; font-size: 12pt; font-stretch: all; font-style: normal; font-variant: normal; font-weight: all; src: local("Optima") }
    --></style>
    </head>

    <body bgcolor="#ffffff">




    <form id="Register" action="http://formmail.dreamhost.com/cgi-bin/formmail.cgi" method="POST" name="Register" enctype="Default">

    <input id="ID_recipient_BC4E067C" type=hidden name="recipient" value="shood@hoodconsultingcorp.com">
    <input id="ID_subject_BC4E067C" type=hidden name="subject" value="10K Race Web Registration">
    <input id="ID_required_BC4E067C" type=hidden name="required" value="realname,address,city,state,zip,sex,shirt,event,email,phone,age,Verify">
    <input type=hidden name="redirect" value="http://www.contactoffayetteville.org/raceAD/redir.html">





    <div align="center">
    <button name="buttonName" type="button" onclick="alert(document.Register.redirect.value);">Button</button>
    <table width="400" border="0" cellspacing="0" cellpadding="5">
    <tr>
    <td>
    <div align="left">
    <font size="5" face="Optima">On-line Registration Form</font></div>
    </td>
    </tr>
    <tr height="3">
    <td bgcolor="#9999ff" height="3">
    <div align="right"></div>
    </td>
    </tr>
    <tr>
    <td valign="top">
    <div align="right">
    <font face="Optima"><label for="ID_FullName_BC4DFCE4"><font size="2" color="black">Full Name: </font></label><input id="ID_FullName_BC4DFCE4" type="text" name="realname" value="" size="40" maxlength="31"></font><br>
    <font size="2"><font color="gray"><i>(eg. Dr. John H. Smith Jr.)</i></font></font></div>
    </td>
    </tr>
    <tr>
    <td>
    <div align="right">
    <font face="Optima"><label for="ID_address_BC4D7036"><font size="2" color="black">Address:</font></label><input id="ID_address_BC4D7036" type="text" name="address" value="" size="30" maxlength="40"></font></div>
    </td>
    </tr>
    <tr>
    <td>
    <div align="right">
    <font face="Optima"><label for="ID_city_BC4DFCF2"><font size="2" color="black">City:</font></label><input id="ID_city_BC4DFCF2" type="text" name="city" value="" size="30" maxlength="40"></font></div>
    </td>
    </tr>
    <tr>
    <td>
    <div align="right">
    <font face="Optima"><label for="ID_state_BC4DFCF8"><font size="2" color="black">State:</font></label><input id="ID_state_BC4DFCF8" type="text" name="state" value="" size="30" maxlength="40"></font></div>
    </td>
    </tr>
    <tr>
    <td>
    <div align="right">
    <font face="Optima"><label for="ID_state_BC4DFCFE"><font size="2" color="black">Zip:</font></label><input id="ID_state_BC4DFCFE" type="text" name="zip" value="" size="10" maxlength="5"></font></div>
    </td>
    </tr>
    <tr>
    <td>
    <div align="right">
    <font face="Optima"><label for="ID_phone_BC4DFD03"><font size="2" color="black">Phone:</font></label><input id="ID_phone_BC4DFD03" type="text" name="phone" value="" size="30" maxlength="40"></font></div>
    </td>
    </tr>
    <tr>
    <td>
    <div align="right">
    <font face="Optima"><label for="ID_email_BC4DFD09"><font size="2" color="black">Email:</font></label><input id="ID_email_BC4DFD09" type="text" name="email" value="" size="30" maxlength="40"></font></div>
    </td>
    </tr>
    <tr>
    <td align="right" valign="top">
    </td>
    </tr>
    <tr>
    <td>
    <div align="right">
    <table border="0" cellspacing="0" cellpadding="5">
    <tr>
    <td width="150">
    <div align="right">
    <label for="ID_selectName_BC4E00F3"><font size="2" face="Optima">Event:</font></label></div>
    </td>
    <td width="50"><select id="ID_selectName_BC4E00F3" name="event" size="1">
    <option selected>Choose Your Event</option>
    <option value="RACE">10K Crossroads Race</option>
    <option value="WALK">1-Mile Walk of Hope</option>
    </select></td>
    </tr>
    <tr>
    <td width="150">
    <div align="right">
    <label><font size="2" color="black">Sex:</font></label></div>
    </td>
    <td width="50">
    <div align="left">
    <select name="sex" size="1">
    <option selected value="Male">Choose</option>
    <option value="Male">Male</option>
    <option value="Female">Female</option>
    </select></div>
    </td>
    </tr>
    <tr>
    <td width="150">
    <div align="right">
    <label><font size="2" face="Optima">T-shirt Size:</font></label></div>
    </td>
    <td width="50">
    <div align="left">
    <select name="shirt" size="1">
    <option selected value="Male">Choose</option>
    <option value="Medium">Medium</option>
    <option value="Large">Large</option>
    <option value="X-Large">X-Large</option>
    </select></div>
    </td>
    </tr>
    <tr>
    <td colspan="2" width="298">
    <div align="right">
    <font color="gray"><i><span style="font-size:10.0pt"><font size="1" face="Optima">(T-shirts will be given to the first 200 paid registrants.)</font></span></i></font></div>
    </td>
    </tr>
    <tr>
    <td width="150">
    <div align="right">
    <label><font size="2" color="black" face="Optima">Age on 3/20/04:</font></label></div>
    </td>
    <td width="50">
    <div align="left">
    <input type="text" name="age" value="" size="3" maxlength="20"><font color="gray" face="Optima"><i>yrs</i></font></div>
    </td>
    </tr>
    </table>
    </div>
    </td>
    </tr>
    <tr>
    <td><font size="1" face="Optima">I understand that a 10K road race requires a level of physical fitness and health and entails associated risks. I am participating in this race freely and, for myself, my heirs, executors and administrators, waive and release any and all rights and claims for damages I have or may have against CONTACT of Fayetteville and/or the organizers and sponsors of this run and their representatives, as well as any and all claims of danger and actions whatsoever in any manner as a result of my participation in this race, including (but not limited to) any injuries I might suffer. I acknowledge that I am aware of the inherent risks involved in running such a race. I grant permission to all the foregoing to use any photographs, motion pictures, recordings or any other record of this event for any legitimate purpose.</font></td>
    </tr>
    <tr height="3">
    <td bgcolor="#9999ff" height="3"></td>
    </tr>
    <tr>
    <td>
    <div align="right">
    <table border="0" cellspacing="0" cellpadding="5">
    <tr>
    <td width="320"><font size="2" color="black" face="Optima">I certify that I am at least 18 years of age and have read and understand all of the above.</font></td>
    <td width="50"><input type="radio" name="Verify" value="Over18" onclick="document.Register.redirect.value='https://www.paypal.com/xclick/business=contact@contactoffayetteville.org&item_name=10k+Crossroads+Race+Registration+-+Adult&item_number=001&&image_url=http://www.contactoffayetteville.org/logo.gif&amount=15.75&no_shipping=1&cn=Additional+Comments&currency_code=USD&lc=US';"></td>
    </tr>
    <tr>
    <td width="320">
    <p class="MsoNormal"><font size="2" color="black" face="Optima">I am under 18 years of age. My parent or legal guardian signifies that he/she has read and understands </font><font size="2" color="black" face="Optima">all of the above.</font>
    </td>
    <td width="50"><input type="radio" name="Verify" value="Under18" ></td>
    </tr>
    </table>
    </div>
    </td>
    </tr>
    <tr height="3">
    <td bgcolor="#9999ff" height="3"></td>
    </tr>
    <tr>
    <td>
    <div align="left">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td align="center" valign="bottom"><input type="reset" value="Clear"></td>
    <td align="center" valign="bottom"><input type="submit" name="Submit" value="Proceed"></td>
    </tr>
    </table>
    </div>
    </td>
    </tr>
    </table>
    </div>
    </form>
    </body>

    </html>

  12. #12
    Join Date
    Sep 2003
    Location
    Portsmouth, UK Occupation: Web Developer
    Posts
    2,602
    the redirect field is being set correctly, how are you using its value to redirect?
    Richard Turner - A Virtual Insight

  13. #13
    Join Date
    Feb 2004
    Posts
    23
    when the form is submitted a cgi takes the value from the hidden element "redirect" value and sends it on its merry way... unless change it that is.

  14. #14
    Join Date
    Sep 2003
    Location
    Portsmouth, UK Occupation: Web Developer
    Posts
    2,602
    well everything is fine the value is set correctly, just the cgi reading it that i guess its a problem it may be the url cos got @ & = . / and all that init
    Richard Turner - A Virtual Insight

  15. #15
    Join Date
    Feb 2004
    Posts
    23
    aight well thanx a lot for your help! :-)

    ~John

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