Solved

Javascript Checkboxes & Drop Down Populate Hidden Field

Posted on 2004-04-11
5
1,486 Views
Last Modified: 2007-12-19
I need a function that "onChange" will write to my hidden fields (multiple values/selections ok).  There is a hidden text field for the checkboxes and one for the drop down.  Any help someone could provide would be appreciated. Thank you

<html>
<head>
<title>What I want to eat</title>
</head>

<body>
<form name="pick_up_request_form">
<table width="600" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>Steak
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox"></td>
  </tr>
  <tr>
    <td>Pizza
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox"></td>
  </tr>
  <tr>
    <td>Spaghetti
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox"></td>
  </tr>
  <tr>
    <td>Dog Food
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox"></td>
  </tr>
  <tr>
    <td>Lobster
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox"> <input name="whatIWantToEatSelection" type="hidden" id="whatIWantToEatSelection"></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><select name="select">
      <option selected>--Select One--</option>
      <option value="Steak">Steak</option>
      <option value="Pizza">Pizza</option>
      <option value="Spaghetti">Spaghetti</option>
      <option value="Dog Food">Dog Food</option>
      <option value="Lobster">Lobster</option>
    </select> <input name="whatIWantToEatSelection2" type="hidden" id="whatIWantToEatSelection2"></td>
  </tr>
</table>
</form>
</body>
</html>
0
Comment
Question by:xcusmwah
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
5 Comments
 
LVL 1

Accepted Solution

by:
bkiahg earned 50 total points
ID: 10803891
Not sure why you would want to do this but...

<html>
<head>
<title>What I want to eat</title>
</head>

<body>
<form name="pick_up_request_form">
<table width="600" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>Steak
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript:document.pick_up_request_form.whatIWantToEatSelection.value='Steak'"></td>
  </tr>
  <tr>
    <td>Pizza
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript:document.pick_up_request_form.whatIWantToEatSelection.value='Pizza'"></td>
  </tr>
  <tr>
    <td>Spaghetti
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript:document.pick_up_request_form.whatIWantToEatSelection.value='Spaghetti'"></td>
  </tr>
  <tr>
    <td>Dog Food
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript:document.pick_up_request_form.whatIWantToEatSelection.value='Dog Food'"></td>
  </tr>
  <tr>
    <td>Lobster
      <input name="whatIWantToEat" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript:document.pick_up_request_form.whatIWantToEatSelection.value='Lobster'">
<input name="whatIWantToEatSelection" type="text" id="whatIWantToEatSelection"></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><select name="select" onChange="JavaScript: document.pick_up_request_form.whatIWantToEatSelection2.value=document.pick_up_request_form.select.value">
      <option selected>--Select One--</option>
      <option value="Steak">Steak</option>
      <option value="Pizza">Pizza</option>
      <option value="Spaghetti">Spaghetti</option>
      <option value="Dog Food">Dog Food</option>
      <option value="Lobster">Lobster</option>
    </select> <input name="whatIWantToEatSelection2" type="text" id="whatIWantToEatSelection2"></td>
  </tr>
</table>
</form>
</body>
</html>

Just change the input types back to hidden and viola.
0
 

Author Comment

by:xcusmwah
ID: 10803918
Perfect, thank you
0
 
LVL 1

Expert Comment

by:bkiahg
ID: 10803949
oops missed the multiple fields try this....

<html>
<head>
<title>What I want to eat</title>

<script language=Javascript>
<!--  Start function //
function hidden(add_value, form_name)  {
      if (form_name.checked)  {
            document.pick_up_request_form.whatIWantToEatSelection.value = document.pick_up_request_form.whatIWantToEatSelection.value + add_value + " ";
      }
      else  {
            my_selec = document.pick_up_request_form.whatIWantToEatSelection.value;
            add_value = add_value + " ";
            testing_array = my_selec.split(add_value);
            document.pick_up_request_form.whatIWantToEatSelection.value = testing_array[0] + testing_array[1];
      }
      // document.pick_up_request_form.whatIWantToEatSelection.value
}
// End -->
</script>
</head>

<body>
<form name="pick_up_request_form">
<table width="600" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>Steak
      <input name="whatIWantToEat1" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript: hidden('Steak', this);"></td>
  </tr>
  <tr>
    <td>Pizza
      <input name="whatIWantToEat2" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript: hidden('Pizza', this);"></td>
  </tr>
  <tr>
    <td>Spaghetti
      <input name="whatIWantToEat3" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript: hidden('Spaghetti', this);"></td>
  </tr>
  <tr>
    <td>Dog Food
      <input name="whatIWantToEat4" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript: hidden('Dog Food',this);"></td>
  </tr>
  <tr>
    <td>Lobster
      <input name="whatIWantToEat5" type="checkbox" id="whatIWantToEat" value="checkbox" onClick="JavaScript: hidden('Lobster',this);">
<input name="whatIWantToEatSelection" type="text" id="whatIWantToEatSelection"></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><select name="select" onChange="JavaScript: document.pick_up_request_form.whatIWantToEatSelection2.value=document.pick_up_request_form.select.value">
      <option selected>--Select One--</option>
      <option value="Steak">Steak</option>
      <option value="Pizza">Pizza</option>
      <option value="Spaghetti">Spaghetti</option>
      <option value="Dog Food">Dog Food</option>
      <option value="Lobster">Lobster</option>
    </select> <input name="whatIWantToEatSelection2" type="text" id="whatIWantToEatSelection2"></td>
  </tr>
</table>
</form>
</body>
</html>
0

Featured Post

What Is Transaction Monitoring and who needs it?

Synthetic Transaction Monitoring that you need for the day to day, which ensures your business website keeps running optimally, and that there is no downtime to impact your customer experience.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question