selected option in drop down menu checks or unchecks checkbox value
I apologize for the confusing title.
In the code below, my goal is to, when an option is selected in the drop down menu, the options class needs to check the matching class in the checkbox array in the next div. So if the first option is selected in the drop down menu (Academic accommodation request), both the first and second checkboxes (Test 1a and Test 1b) need to be checked.
I have had success grabbing the title attribute in select options but have not had much luck grabbing selected option classes.
Any chance I am on the right track? If not, if anyone can point me in the right directions, I would be super grateful! Thanks!
Peter T
<div class="padding-bottom-1em">
<ul class="blocks-1 end">
<li><label for="recipient_email_user">Issue/Topic:<span class="required">* </span> (select one)</label><br />
<select name="recipient_email_user" id="recipient_email_user" class="{validate:{required:true}} unit-100 chosen-select">
<option value="">Select one...</option>
<option value="selection 1" title="Academic accommodation request" class="test1">Academic accommodation request</option>
<option value="selection 2" title="Academic advising" class="test2">Academic advising</option>
<option value="selection 3" title="https://google.com">Advising Hold</option>
</select>
</ul>
</div>
<input type='hidden' name="short_field_002" id='short_field_002' value='' />
<ul class="forms-list">
<li>
<label for="recipient_email_user_Academic_accommodation_request_1">
<input type="checkbox" name="recipient_email_user[]" value="jon@mail.com" id="recipient_email_user_Academic_accommodation_request_1" class="test1" />Test 1a
</label>
<label for="recipient_email_user_Academic_accommodation_request_2">
<input type="checkbox" name="recipient_email_user[]" value="jane@mail.com" id="recipient_email_user_Academic_accommodation_request_2" class="test1" />Test 1b
</label>
<label for="recipient_email_user_Academic_advising_1">
<input type="checkbox" name="recipient_email_user[]" value="pete@mail.com" id="recipient_email_user_Academic_advising_1" class="test2" />Test 2a
</label>
</li>
</ul>
js:
jQuery(document).ready(function() {
// pass the title of the selected topic option to a hidden 'topic' form field
jQuery('select#recipient_email_user').change(function() {//used to be recipients_multiple_emails | short_field_001
var topic = jQuery('select#recipient_email_user option:selected').attr('title');
// set the hidden input's value
jQuery('#short_field_002').val(topic);
var topic_email = jQuery('select#recipient_email_user option:selected').attr('class');
$(topic_email).prop( "checked", true );
});
});