I don't expect anyone to write this for me, but at least point me in the right direction, as I can't even find a good search phrase to find similar solutions.
I have many mailto links on a web page and they're all categorized by class. I need to offer the ability for a user to select multiple categories using checkboxes and have all matching email addresses be added to one master mailto link. Something like this:
<p>To send a message to one or more groups, make your selection and click "Send Message."</p>
<input type="checkbox" name="mailing-groups" value="nursing" class="mailing-groups" /> Nursing<br />
<input type="checkbox" name="mailing-groups" value="facilities" class="mailing-groups" /> Facilities<br />
<input type="checkbox" name="mailing-groups" value="board-of-directors" class="mailing-groups" /> Board of Directors
<a id="staff-mailer" href="" class="btn"><em class="icon-ok"></em> Send Message</a>
<a class="nursing" href="mailto:john@doe.com">john@doe.com</a>
<a class="facilities" href="mailto:jane@doe.com">jane@doe.com</a>
<a class="board-of-directors" href="mailto:jack@doe.com">jack@doe.com</a>
<a class="nursing" href="mailto:jason@doe.com">jason@doe.com</a>
<script language="javascript">
$('.mailing-groups').click(function(){
var addresses = COMMA-SEPARATED_LIST_OF_ALL_EMAIL_ADDRESSES_WHOSE_CLASSES_MATCH_THE_CHECKBOX_SELECTIONS
$("#staff-mailer").attr("href", "mailto:" + addresses)
});
</script>
Try something like:
// initialize empty array on each click of a checkbox
var addressArray = [];
// find each checkbox that is checked
$("input[name='mailing-groups']:checked").each(function (index, el) {
var className = $(el).val();
// use the value of each checked checkbox to find the mailto elements with that class
$("."+className).each(function (mailindex, mailelement) {
addressArray.push($(mailelement).text());
});
});
// create a comma separated string from the array
var addresses = addressArray.join(",");