自动选择值<select multiple =“multiple”>

I am new to coding but trying to help myself. If any one can suggest would be great.

I am using a plugin which is creating a below form. I checked this by inspecting elements on browser.

<select multiple="multiple" name="attendee_information_fields[]" id="attendee_information_fields" class="event-manager-multiselect" data-no_results_text="No results match" attribute="" data-multiple_text="Select Some Options" style="display: none;">
        <option value="full-name">Full name</option>
        <option value="email-address">Email address</option>
        <option value="phone">Phone</option>
        <option value="location">Location</option>
        <option value="gender">Gender</option>
        <option value="age">Age</option>
        <option value="terms-conditions">Terms &amp; Conditions</option>
        <option value="become-a-cfp-camper">Become a CFP Camper</option>
</select>

This is a mandatory field. What I want is the option values should auto selected with values terms-conditions and become-a-cfp-camper. For this, I am writing below code in my theme's functions.php file:

if($_POST['attendee_information_fields']) { echo "
<script type='text/javascript'>
$('#attendee_information_fields').click( function() {
    $('select#terms-conditions > option').attr('selected', 'selected');
    $('select#become-a-cfp-camper > option').attr('selected', 'selected');
});
</script>";
}

Nothing seems to happen and I am clueless. Can anyone help how can I achieve this? Many thanks.

$('select#terms-conditions > option') is trying to find all <option> elements inside a <select id="terms-conditions">. You don't have that; instead, you have a <select id="attendee_information_fields"> which contains a <option value="terms-conditions">.

To select that option, you need to use $('select#attendee_information_fields option[value=terms-conditions]')

There are several issues to your problem:

1. Your jQuery is selecting a <select> element with IDs ($('select#terms-conditions > option')), when what you want to do is actually to search for nested <option> elements with the value that matches, e.g. ($('select option[value="terms-conditions"]'))
2. You are using .attr() instead of .prop() to set boolean attributes

My solution is as follow:

1. Listen to modifications on the <select> field (we try to avoid listening to click events on input elements). This is done by binding the .change() method
2. Go through all the <option> elements found in the element (referenced by $(this).find('option'))
3. We filter this collection using jQuery's .filter() method to only return elements whose value attribute are found in the array. The array should contain the values that you are interested in selecting: evaluated using the simply Array.prototype.indexOf method in native JS: when the index return is 0 or more, it means the value is in your array. The array you want to look at will be ['become-a-cfp-camper', 'terms-conditions'].
4. To the filtered selection of <option> elements, we simply programatically select them using .prop('selected', true).

$(function() {
  $('#attendee_information_fields').change(function() {
    $(this).find('option').filter(function() {
      return ['become-a-cfp-camper', 'terms-conditions'].indexOf($(this).val()) > -1;
    }).prop('selected', true);
  });
});

select {
  height: 200px; /* Just to have a better view */
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select multiple name="attendee_information_fields[]" id="attendee_information_fields" class="event-manager-multiselect" data-no_results_text="No results match" attribute="" data-multiple_text="Select Some Options">
        <option value="full-name">Full name</option>
        <option value="email-address">Email address</option>
        <option value="phone">Phone</option>
        <option value="location">Location</option>
        <option value="gender">Gender</option>
        <option value="age">Age</option>
        <option value="terms-conditions">Terms &amp; Conditions</option>
        <option value="become-a-cfp-camper">Become a CFP Camper</option>
</select>

</div>