How to manipulate form field values in javascript
<p>I'm trying to get the value of a few checkboxes and enter them in a hidden form field.</p>

<p>My checkboxes look like this:</p>

<pre><code>&lt;form&gt;
  &lt;input type="checkbox" name="chicken" id="chicken" value="chicken"/&gt;Chicken
  &lt;input type="checkbox" name="meat" id="meat" value="meat"/&gt;Meat
&lt;/form&gt;

&lt;form method="post" action=""&gt;
   &lt;input type="hidden" name="my-item-name" value="" /&gt;
   &lt;input type="submit" name="my-add-button" value=" add " /&gt; 
&lt;/form&gt;
</code></pre>

<p>I only need to submit the hidden field data so I'd like the value of the hidden field change when the checkbox is ticked. So if the first checkbox is ticked I'd like the value of the hidden field to become chicken and if both of them are ticked the value should be chicken,meat.</p>

<p>I'm using the following javascript</p>

<p></p>

<pre><code>function SetHiddenFieldValue()
{
  var checks = document.getElementsByName("checkbox");
  var hiddenFieldVal = "";

  for(i = 0; i &lt; checks.length; i++)
  {

    if(hiddenFieldVal != "")
       hiddenFieldVal += ",";
    hiddenFieldVal += checks[i].value;
  }

  document.getElementById('my-item-name').value = hiddenFieldVal;
}
</code></pre>

<p>but when I add the items, it adds both of them, it doesn't check which one's been checked, is there a way to fix that, so when the first item is checked it'll only add that item and if both of them are checked, it'll add 2 items separated by comma,</p>
