how to pass value of checkboxes using ahref - html

Question

I am using following code in my project
<cfoutput query="getOptions">
<tr>
<td align="center"> #optionname#</td>
<td align="center"> #DollarFormat(optionprice)#</td>
<td><input type="checkbox" name="OptionalID" value="#OptionID#" ></td>
</tr>
</cfoutput>
And i am passing the value to other form as follows
<a href="addtocart.cfm?pid=#productId#&OptionalID=#OptionalID#">
what should i do to pass all values of all the checkboxes that are checked.Please help
Thanks in advance

Answer 1

Change your page to use a form instead of passing the values via a link.
Something along the lines of:
<form name="myform" action="addToCart.cfm" method="post">
<cfoutput>
<input type="hidden name="pid" value="#productId#">
<input type="hidden name="OptionalID" value="#OptionalID#">
<cfloop query="getOptions">
<tr>
<td align="center"> #optionname#</td>
<td align="center"> #DollarFormat(optionprice)#</td>
<td><input type="checkbox" name="OptionalID" value="#OptionID#"></td>
</tr>
</cfloop>
<input type="submit" value="Add to cart">
</cfoutput>
</form>
You can pass as many values as you want now, and the checkboxes will come up as a list.
hope that helps

Answer 2

Though you can get tricky with JavaScript, if you use an A to add to cart, you'll only be passing the values in the URL. You want to use a form instead.
<form name="cartForm" action="addtocart.cfm?pid=#productId#&OptionalID=#OptionalID#" method="POST">
. . . .
</form>
Of course, this means you'd ordinarily use a submit button inside your form. If you're set on using a link, you can do
Add to cart
(note that I've omitted various tags and escaping of # for simplicity)

Answer 3

You need JavaScript for that.
First, have this in your page where you have the code you posted:
<script type="text/javascript">
function AddCheckboxValues(oLink, sName) {
var arrCheckboxes = document.getElementsByName(sName);
var values = [];
for (var i = 0; i < arrCheckboxes.length; i++) {
if (arrCheckboxes[i].checked) {
values.push(arrCheckboxes[i].value);
}
}
oLink.href += "&" + sName + "=" + values.join(",");
}
</script>
Second, add onclick to the link tag:
<a href="addtocart.cfm?pid=#productId#" onclick="AddCheckboxValues(this, 'OptionalID');">
That's it, now the form addtocart.cfm will get query string values of the checkboxes ticked by the user.