Gather checkbox values inside a hidden input

Question

I have 5 checkboxes, each has its own value.

If I submit them normally, I get a $_GET request like

http://siteurl.com/?&checkbox1=a&checkbox2=b&checkbox3=c....

It looks ugly, so I was thinking I could send a hidden input instead, like:

http://site.url.com/?checkeddata=a,b,c...

So how could I pick-up data from the checkboxes and store it in the hidden field?

Answer 1

If you don't want user to see the data sumited, you should consider using the POST method.

See how to choose between get or post here

By the way, you should also consider using the .serialize() function from the jquery API.

See also this SO thread on POST and Serialize: jquery serialize and $.post

Answer 2

I would suggest just making your individual checkbox names presentable, there's nothing that "ugly" about that URL and it is more clear. If you don't want the user to see anything, consider POST.

If you really want to do it, you will want to:

• catch the submit button click with jquery
• Use Jquery to find the value of each of your checkboxes: $("#checkbox_id").is(':checked');
• Build a new parameter with the values you checked
• Keep the checkboxes from being submitted by either placing them outside the form in the DOM, removing on submit, or using serialize to create a new parameter list and submitting that.