Php Jquery Set Multiple selected values from database - php

Question

I have three multiple select menus. I am trying to select the options returned from a database query. It is not setting any options. I console log the arrays returned by php and they are displayed as:["5233", "7148"]["5233", "5437", "5316"]["7029", "7852", "5525"].
I am not concerned about the form submission at this point. I only want to display the values returned from the db query as selected. I am sure there is something I am missing but can't seem to figure it out. I appreciate all the help I get. Thank you in advance!!
First are my 3 database arrays that are created:
Second is my html:
Third is my javascript/jQuery:
I have three multiple select menus. I am trying to select the options returned from a database query. It is not setting any options. I console log the arrays returned by php and they are displayed as:["5233", "7148"]["5233", "5437", "5316"]["7029", "7852", "5525"].
I am not concerned about the form submission at this point. I only want to display the values returned from the db query as selected. I am sure there is something I am missing but can't seem to figure it out. I appreciate all the help I get. Thank you in advance!!
First are my 3 database arrays that are created:
Second is my html:
Third is my javascript/jQuery:
<?
$huntNum = $hunts[$i][$fm_hunt_fields['__id']];
$cookRole = 'Cook';
$cookVols = get_volunteersByHunt($huntNum, $cookRole);
foreach ($cookVols as $cVols) {
//create new cook array that only contains ID of person
$exCooks[] = $cVols['_id_acct'];
}
$guideRole = 'Hunt Guide';
$hgVols = get_volunteersByHunt($huntNum, $guideRole);
foreach ($hgVols as $hVols) {
$exHg[] = $hVols['_id_acct'];
}
$supportRole = 'General Support';
$gsVols = get_volunteersByHunt($huntNum, $supportRole);
foreach ($gsVols as $gVols) {
$exGs[] = $gVols['_id_acct'];
}
?>
<script>
var existing_cooks = <?= json_encode($exCooks); ?>
var existing_hgs = <?= json_encode($exHg); ?>
var existing_gss = <?= json_encode($exGs); ?>
</script>
<form action="" name="vol-update" id="vol-update" class="vol- update" method="post">
<input type="hidden" id="id_hunt" name="id_hunt" value="<?= $huntNum; ?>" />
<input type="hidden" name="action2" id="action2" value="1" />
<table class="tyhp-account">
<tr>
<td>
<div class="floatL cont_lft_side">
<label for="cooks"><strong>Cooks</strong></label>
<select name="cook[]" class="form-control vCooks" multiple="multiple">
<?php
foreach ($cooksArray as $cook) {
?>
<option
<?
if (in_array($cook['ID'], $exCooks)) {
echo "selected='selected'";
}
?>
value="<?= $cook['ID']; ?>" >
<?= $cook['name_last'] . $cook['name_first']; ?>
</option>
<?
}
?>
</select>
</div>
</td>
<td>
<div class="floatL cont_lft_side">
<label for="hunt_guides"><strong>Hunt Guides</strong></label>
<select name="huntGuide[]" class="form-control vHg" multiple="multiple">
<?php
foreach ($guidesArray as $guide) {
?>
<option
<?
if (in_array($guide['ID'], $exHg)) {
echo "selected='selected'";
}
?>
value="<?= $guide['ID']; ?>" >
<?= $guide['name_last'] . $guide['name_first']; ?>
</option>
<?
}
?>
</select>
</div>
</td>
<?php
$allVols = getAllVolunteers();
?>
<td>
<div class="floatL cont_lft_side">
<label for="supp"><strong>General Support</strong></label>
<select name="gsupport[]" class="form-control vSupp" multiple="multiple">
<?php
foreach ($allVols as $allVol) {
?>
<option
<?
if (in_array($allVol['__id'], $exGs)) {
echo "selected='selected'";
}
?>
value="<?= $allVol['ID']; ?>" >
<?= $allVol['name_last'] . $allVol['name_first']; ?>
</option>
<?
}
?>
</select>
</div>
</td>
</tr>
<tr>
<td> </td>
<td style="text-align:center">
<input type="submit" name="action" id="upVol" class="btn btn-primary" value="Update Volunteers">
</td>
<td> </td>
</tr>
</table>
</form>
//Volunteer information for hunts
<script>
var cooks = existing_cooks;
var hunt_guides = existing_hgs;
var gen_support = existing_gss;
console.log(cooks);
console.log(hunt_guides);
console.log(gen_support);
//Cooks multiSelect
$(".vCooks").val(cooks);
$('.vCooks').multiselect({
columns: 2,
placeholder: 'Select Cooks'
});
//Hunt Guide multi-select
$(".vHg").val(hunt_guides);
$('.vHg').multiselect({
columns: 2,
placeholder: 'Select Hunt Guides'
});
//General Support multi-select
$(".vSupp").val(gen_support);
$('.vSupp').multiselect({
columns: 2,
placeholder: 'Select General Support'
});
return false;
</script>