[JsGrid] "select" filter autocomplete?

Question

PHP

There is a JsGrid table, filled with data from Json:

var types_ev_js = [
        { Name: " ", Id: 0 },
        { Name: "Инкассация", Id: 1 },
        { Name: "Приз", Id: 2 },
        { Name: "Игра", Id: 3 },
        { Name: "Ключ(каретка)", Id: 4 },
        { Name: "Состояние питания", Id: 5 },
        { Name: "Ошибка купюрника", Id: 6 },
        { Name: "Ошибка диспенсера", Id: 7 },
        { Name: " RES ", Id: 8 },
        { Name: "Выдача карточки", Id: 9 },
        { Name: "Монетник", Id: 10 },
        { Name: "Купюрник", Id: 11 },
        { Name: "Безнал", Id: 12 },
        { Name: "Счётчик купюрника", Id: 40 },
        { Name: "Счётчик игр", Id: 41 },
        { Name: "Счётчик призов", Id: 42 },
        { Name: "Пропущенные события", Id: 43 },
        { Name: "Ошибка диспенсера", Id: 8 },
        { Name: "Ошибка соединения", Id: 209 },
        { Name: "Датчик открытия двери", Id: 210 },
        { Name: "Счётчик монет", Id: 44 },
        { Name: "Счётчик безнал", Id: 45 },
        { Name: "Выдача чека", Id: 500 },
        { Name: "Перезапуск устройства", Id: 50 }

    ];
    var types_ev_machine = <?=json_encode($events->GetArrayTypes());?>;
    var types_ev_city = <?=json_encode($events->GetArrayCity());?>;
    var types_ev_place = <?=json_encode($events->GetArrayPlace());?>;
    
    $("#jsGrid4").jsGrid({
        height: "auto",
        width: "100%",

        filtering: true,
        sorting: true,
        paging: true,
        autoload: true,
        loadIndication: true,
        loadIndicationDelay: 100,
        loadMessage: "Получение данных с сервера...",
        loadShading: true,
        editing: false,
        inserting: false,
        deleting: false,
        
        controller: {
            loadData: function(filter) {
                console.log(filter);
                return $.ajax({
                    url: "./parcer.php?get=events",
                    data: filter,
                    dataType: "json"
                });
            }
        },

        fields: [
            { name: "TimeS", type: "text", title: "Время сервера",  width: 25 },
            { name: "CityID", type: "select", title: "Город", items: types_ev_city, valueField: "CityID", textField: "Describe", width: 20 },
            { name: "PlaceID", type: "select", title: "Расположение", items: types_ev_place, valueField: "PlaceID", textField: "Describe", width: 20 },
            { name: "TypeID", type: "select", title: "Тип устройства", items: types_ev_machine, valueField: "TypesID", textField: "Describe",  width: 15 },
            { name: "MachineID", type: "text", title: "Аппарат",  width: 10 },
            { name: "Code", type: "select", title: "Событие", items: types_ev_js, valueField: "Id", textField: "Name",  width: 25 },
            { name: "Value", type: "text", title: "Значение",  width: 10 },
            { type: "control",  width: 10 }
        ]
    });

When a filter is selected, a GET request is sent to the php file



parser GET filter requests:

if ($_GET["get"] == 'events') {
        if(($_GET["TimeS"] != null) or ($_GET["MachineID"] != null) or ($_GET["TypeID"] != null) or ($_GET["PlaceID"] != null) or ($_GET["CityID"] != null) or ($_GET["Code"] != 0) or ($_GET["Value"] != null)){
            echo $events->getAllEvents($_GET["TimeS"], $_GET["MachineID"], $_GET["TypeID"], $_GET["PlaceID"], $_GET["CityID"], $_GET["Code"], $_GET["Value"], 1000);
        }else{
            echo $events->getAllEvents(0,0,0,0,0,0,0,1000);
        }
    }

class Events
Data output:

function getAllEvents($f_TimeS, $f_MachineID, $f_TypeID, $f_PlaceID, $f_CityID, $f_Code, $f_Value, $count) {
        /*
         * Функция выводит последние N событий
         * TODO по фильтру
         */
        $str_query = null;
      if($f_TimeS==0 and $f_MachineID==0 and $f_TypeID==0 and $f_CityID==0 and $f_PlaceID==0 and $f_Code==0 and $f_Value==0)
      {
            $result = $this->_db_test->query("SELECT * FROM Events ORDER BY `TimeS` DESC LIMIT {$count};");
            while ($row = $result->fetch()) {
                if(isset($row['TimeD'])){
                    $row['TimeS'] = $this->GetTimeView($row['TimeS']);
                    $row['TimeD'] = $this->GetTimeView($row['TimeD']);
                    if($row['MachineID']!=null) {
                        $NameMachine =  $this->GetNameMachine($row['MachineID']);
                        $row['MachineID'] = "
<form name='form1' enctype='multipart/form-data' action='machines.php' method='post'>
<input type='submit' value='{$NameMachine}'>
<input type='hidden' name='machine' value='{$row['MachineID']}'>
<input type='hidden' name='fromlink' value='1'>
</form>" ;
                    }
                }
                $data[] = $row;
            }
        }else{

          if($f_Value!=0){
              $str_query.= " and `Value`={$f_Value}";
            }
            if($f_Code!=0){
                $str_query.= " and `Code`={$f_Code}";
            }
            if($f_TypeID!=0){
                $str_query.= " and `TypeID`={$f_TypeID}";
            }
            if($f_CityID!=0){
                $str_query.= " and `CityID`={$f_CityID}";
            }
            if($f_PlaceID!=0){
                $str_query.= " and `PlaceID`={$f_PlaceID}";
            }
            $result = $this->_db_test->query("SELECT * FROM Events WHERE `TimeS`!=0  {$str_query} ORDER BY `TimeS` DESC LIMIT {$count};");
            while ($row = $result->fetch()) {
                if(isset($row['TimeD'])){
                    $row['TimeS'] = $this->GetTimeView($row['TimeS']);
                    $row['TimeD'] = $this->GetTimeView($row['TimeD']);
                    if($row['MachineID']!=null) {
                        $NameMachine =  $this->GetNameMachine($row['MachineID']);
                        $row['MachineID'] = "
<form name='form1' enctype='multipart/form-data' action='machines.php' method='post'>
<input type='submit' value='{$NameMachine}'>
<input type='hidden' name='machine' value='{$row['MachineID']}'>
<input type='hidden' name='fromlink' value='1'>
</form>" ;
                    }
                }
                $data[] = $row;
            }

        }
        echo json_encode(array_values($data));
        }

Getting location data:

public function GetArrayPlace() {
        //Функция возвращает
        $data[] = array("PlaceID"=>0, "Describe" => '');
        $result = $this->_db_test->query("SELECT * FROM places");
        while ($row = $result->fetch(PDO::FETCH_ASSOC)) {
            $data[] = array("PlaceID"=>$row['PlaceID'], "Describe" => $row['Describe']);;
        }
        return $data;
    }

Getting a list of cities:

public function GetArrayCity() {
        //Функция возвращает
        $data[] = array("CityID"=>0, "Describe" => '');
        $result = $this->_db_test->query("SELECT * FROM cities;");
        while ($row = $result->fetch(PDO::FETCH_ASSOC)) {
            $data[] = array("CityID"=>$row['CityID'], "Describe" => $row['Describe']);;
        }
        return $data;
    }

Currently, the location filter is populated with all locations from cities. Each city has its own locations. How to make it so that after selecting a city, the location filter is filled only with those places that are tied to the city...