Your checkboxes all have the same ID attribute, and they have no NAME
attribute. Give each one a unique ID and NAME. You can use same value for
those two attributes in a single checkbox, or they can be different. But
each ID and each NAME should be unique.

Also, quote all of your attribute values, using double quotes only. You have
some attributes unquoted, and others with a double quote and a single quote.

Finally, not related to the posting problem, but for a better user
experience use <label> tags for your checkbox labels, so a click on the
label works as a click on the checkbox.

I'd suggest using XHTML-style self-closing tags while you're at it.

You'll end up with HTML something like this:

  <input type="checkbox" id="apples" name="apples" value="apples" />
  <label for="apples">Apples</label>

  <input type="checkbox" id="pizza" name="pizza" value="pizza" />
  <label for="pizza">Pizza</label>

  <input type="checkbox" id="cake" name="cake" value="cake" />
  <label for="cake">Cake</label>

I used the same value for ID and NAME that you had for the VALUE attribute,
but that certainly isn't required. You can use any ID and NAME that you
like. Just make sure that the for="..." in the <label> tag matches the ID
for the checkbox. The NAME attribute is used for form posting, and the ID
attribute is used for matching labels with checkboxes.

You may run into an alternate syntax for using the <label> tags, where you
don't use the for="..." but instead nest the <input> tag inside the <label>.
That is cleaner, but it doesn't work in IE so it's best avoided. Use the
for="..." instead.

-Mike

> From: tradeallday
> 
> I've got checkboxes on my page. When I use the $.post method, 
> it's only transmitting the first value out of my list. Here's my code:
> 
> $.post("http://localhost/search_engine.php",{
>                                       food_type: 
> $("#food_type").val(),
>                                       foods: 
> $(":checkbox").fieldValue(),
>                  }, function(xml) {
>                          displayResult(xml);
> });
> 
> the checkboxes look like this:
> 
> <input type=checkbox id=foods value="apples'>Apples <input 
> type=checkbox id=foods value="Pizza'>Pizza <input 
> type=checkbox id=foods value="Cake'>Cake
> 
> If I check all three, I only get the first one, although if I 
> do an alert of
> 
> $(":checkbox").fieldValue()
> 
> I get back all the results I selected.
> 
> I'm using the jquery form library jquery.form.js.
> 
> Should I be posting this data some other way? Or is my syntax wrong?
> 
> Thanks,
> 

Reply via email to