Multiple checkbox values search javascript
- by JV10
I have a list of keywords, and I've created a checkbox for each. My template has a form wrapping the content, so I can't have a nested form around the checkbox list.
How can I send the selected checkbox values to my search results page?
The form that wraps the content doesn't have any actions or methods applied:
<form id="BoostMasterForm" runat="server">
This the HTML markup of my checkbox list:
<div class="checkboxes">
<ul>
<li>
<input type="checkbox" name="search" class="options" value="one">
<label>one</label>
</li>
<li>
<input type="checkbox" name="search" class="options" value="two">
<label>two</label>
</li>
<li>
<input type="checkbox" name="search" class="options" value="three">
<label>three</label>
</li>
</ul>
<input type="submit" value="Submit"/>
</div>
How can I use javascript or jQuery to submit the values of the multiple checkbox selections and on submit action them to the following URL: '/imagery/image-search.aspx'
The resulting URL for a search where option 1 and 3 are submitted should be: '/imagery/image-search.aspx?search=one%20three'
I'm using this javascript that I found on another post, however I need it to append the form an the action and the method. My website is ASP, where this post is for a PHP site:
Sending multiple checkbox options
$('.options').click(function() {
var selectedItems = new Array();
$(".checkboxes input:checkbox[name=search]:checked").each(function() {selectedItems.push($(this).val());});
var data = selectedItems.join('|');
$("#opts").val(data);
});
If anyone can help, it'd be greatly appreciated.
Cheers, JV
