I have created a multi-select dropdown. I want to send the selected values to my php code which I then use to create a mysql query. Unfortunately, I am not able to access those variables in php.
Here is my code.
function Participants(sid) {
    console.log(sid); //the sid identitifies the market
    $('#participants').empty();
    $('#participants').append("<option>Loading......</option>");
    $.ajax({
        method: "POST",
        url: "participants_dropdown.php?sid=" + sid,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data) {
            $('#participants').multiselect('destroy');
            $('#participants').empty();
            $.each(data, function(i, item) {
                $('#participants').append('<option value="' + data[i].facility_id + '" >Call-Sign: ' + data[i].call_sign + ' - Operator: ' + data[i].operator + ' - Primary Programming: ' + data[i].primary_programming + '</option>');
            });
            $('#participants').multiselect({
                buttonWidth: '400px',
                includeSelectAllOption: true,
                nonSelectedText: 'Select an Option',
                onChange: function(option, checked) {
                    var selected = this.$select.val();
                    if (selected.length > 0) {
                        console.log(selected);
                        $.ajax({
                            url: "selected_participants.php?sid=" + sid,
                            method: "POST",
                            data: {
                                selected: selected
                            },
                            success: function(data) {
                                console.log('success with participating facility ids');
                                $('#atsc1_host1').append("<option value='0'>---Select Station--</option>");
                                $.each(data, function(i, item) {
                                    $('#atsc1_host1').append('<option value="' + data[i].facility_id + '">' + data[i].call_sign + '</option>');
                                });
                            },
                            complete: function() {}
                        });
                    }
                }
            });
        },
        complete: function() {}
    });
}
HTML:
<div class="col-md-4" style="color: black;">
<h3><span>2) Select Market Participants</span></h3>
<h6><select id="participants" multiple class="form-control" style="color:gray;" >
<option value="" disabled selected>Choose your a market first</option><h6>
</select>
<button class="btn-save btn btn-primary btn-sm">Save</button>
</div>
<?php
    $sid=$_GET['sid'];
    $selected_list=$_POST['selected'];
    var_dump($selected_list);
    $selected_list2 = join(",",$selected_list);
    var_dump($selected_list2);
  ?>
The multi-select list is correctly populated but when I attempt to post my selected values back into PHP to then run another mysql query, I get the following message in my console:
["306"] **Which means that it correctly sees my selected station
market_plans.php:152 success with participating facility ids ***which means that the second ajax request was successfully executed
Uncaught TypeError: Cannot use 'in' operator to search for 'length' in array(2) {
  [0]=>
  string(3) "306"
  [1]=>
  string(5) "59988"
}
string(9) "306,59988"
***which appears to indicated that I am getting an array for my $selected variable but which is somehow unaccessible.
I thought it was because I was passing an array, so I tried both the join and implode functions in PHP, but that did not resolve my problem.
Any thoughts or help would be appreciated!
I would add that the output on my php page states: NULL string(0). So it does not appear to be reading of json data problem.
Here is the mysql statement:
$query = "SELECT 
        station_table.call_sign, 
        station_table.facility_id, 
        station_table.operator, 
        station_programming.primary_programming, 
        station_programming.primary_resolution, 
        rt1.resolution_type AS primary_resolution_type, 
        station_programming.d_2_programming, 
        station_programming.d_2_resolution, 
        rt2.resolution_type AS d_2_resolution_type, 
        station_programming.d_3_programming, 
        station_programming.d_3_resolution,
        rt3.resolution_type AS d_3_resolution_type, 
        station_programming.d_4_programming, 
        station_programming.d_4_resolution, 
        rt4.resolution_type AS d_4_resolution_type, 
        station_programming.d_5_programming, 
        station_programming.d_5_resolution, 
        rt5.resolution_type AS d_5_resolution_type, 
        station_programming.d_6_programming, 
        station_programming.d_6_resolution, 
        rt6.resolution_type AS d_6_resolution_type 
    FROM market_table 
    INNER JOIN station_table ON market_table.nielsen_dma_code=station_table.nielsen_dma_code 
    INNER JOIN station_programming on station_table.facility_id=station_programming.facility_id 
    LEFT JOIN resolution_table AS rt1 on station_programming.primary_resolution=rt1.resolution 
    LEFT JOIN resolution_table as rt2 on station_programming.d_2_resolution=rt2.resolution 
    LEFT JOIN resolution_table as rt3 on station_programming.d_3_resolution=rt3.resolution 
    LEFT JOIN resolution_table as rt4 on station_programming.d_4_resolution=rt4.resolution 
    LEFT JOIN resolution_table as rt5 on station_programming.d_5_resolution=rt5.resolution 
    LEFT JOIN resolution_table as rt6 on station_programming.d_6_resolution=rt6.resolution 
    WHERE 
        station_table.nielsen_dma_code ='".$sid."' AND
        station_table.facility_id in (".$selected_list2.") 
    ORDER BY station_table.call_sign asc";
 
    