Parameter list to a query string HTML Form - html

Question

<form name="input" action="/test/compare method="get">
<input type="checkbox" name="id" value="val1">val1<br/>
<input type="checkbox" name="id" value="val2">val2<br/>
<input type="submit" value="Submit">
</form>
I want a query string that looks like this:
/test/compare?id=val1,val2
Is this possible?

Answer 1

Not exactly as comma separated values, but you can get an array of values of all selected checkboxes as follows.
<form name="input" action="/test/compare" method="get">
<input type="checkbox" name="id[]" value="val1">val1<br/>
<input type="checkbox" name="id[]" value="val2">val2<br/>
<input type="submit" value="Submit">
</form>
PHP
// here you'l get array of id in $_GET and process according to your need
$ids=$_GET['id'];
$str=implode(",",$ids); //array to comma separated values
echo $str; //output will be checked checkbox values--> val1,val2
EDIT:
ANOTHER SOLUTION USING JAVASCRIPT
<form name="input" action="/test/compare" method="get">
<input type="checkbox" name="id" value="val1">val1<br/>
<input type="checkbox" name="id" value="val2">val2<br/>
<input type="submit" value="Submit">
</form>
<!-- load jQuery -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"> </script>
<script type="text/javascript">
$(document).ready(function(){
$("form[name=input]").submit(function(){ //bind onSubmit handler on page ready
//get all field values
var query="id="; //write here parameter name
$("form[name=input] [name=id]:checked").each(function(i){ //it will check for all elements inside form with name "id"
query+=$(this).val()+",";
});
query=query.slice(0,-1); //remove last extra comma
//redirect url by passing "query" as GET parameter
window.location=$(this).attr("action")+"?"+query;
return false;
});
});
</script>

Answer 2

You can make name="id[]" to make the form parameter an array, but aside from that I don't believe it's possible to do what you are asking. You should have unique values as form fields unless they are an array.