Q:

Вывод значений из mysql через ajax

Есть таблица в бд(id, marka, model)
Из этой таблицы вывожу в первый список значения marka 
<select class="filtr__select" id="idcat">
                        <option id="marka-avto">Выберите марку авто</option>
                        <? php
                            //Выводим категории и ее ID
                            while ($row=mysql_fetch_assoc($result))
                            {

                            $marka = $row['marka']; 

                            echo "<option value=\"$marka\">$marka</option>";

                            }
                        ? >
                    </select>

второй список нужно сделать так чтобы брал значения из первого списка марок, и по этим значениям подгружал модели(тоесть в первом списке список марок, если выбор допустим пал на марку toyota, то должен подгружаться список моделей для toyota)
      <select class="filtr__select" id="idcat">
                            <option>модель</option>
                           <? php
                             //Выводим категории и ее ID
                             while ($row=mysql_fetch_assoc($result))
                             {
                             $id = $row['id']; // иднтификатор
                             $model = $row['model']; 

                             echo "<option value=\"$id\">$model</option>";

                             }
                         ? >
                    </select>

 Подскажите как сделать так чтобы во второй список подгружались значения model конкретной марки(marka) Пробывал скрипт сам написать на аяксе но что то не получилось... 

                   <script>
                            $("#idcat").change(function(){

                                var idcat = $(this).val();
                                $.ajax({
                                    type: 'GET',      
                                    url: 'index.php',
                                    data: ['model'],
                                    success: function(data) {
                                        $('#idcat2').html(data);
                                    }
                                });
                            });

                        </script>

 Правка (полностью файл)
        <? php

        $hostname = "localhost"; 
        $username = "***"; 
        $password = "***"; 
        $dbName = "***"; 

        mysql_connect($hostname, $username, $password) or die ("Не могу         создать соединение");
        mysql_query('SET NAMES utf8') or header('Location: Error');

        mysql_select_db($dbName) or die (mysql_error());

        $query = "SELECT DISTINCT model FROM filtr_db";
        $query = "SELECT DISTINCT marka FROM filtr_db";
        $result = mysql_query($query);

        ? >

       <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

         <form id="myForm">
            <div class="filtr__1">
                <div class="filtr__1__form">
                    <h1 class="filtr__1__form__title">Быстрый подбор по авто</h1>
                    <select class="filtr__select" id="idcat">
                        <option id="marka-avto">Выберите марку авто</option>
                        <? php
                            //Выводим категории и ее ID
                            while ($row=mysql_fetch_assoc($result))
                            {

                            $marka = $row['marka']; 

                            echo "<option value=\"$marka\">$marka</option>";

                            }
                        ? >
                    </select>
                    <select class="filtr__select" id="idcat2">
                        <option id="model-avto">модель</option>

                    </select>
                    <script type="text/javascript">
                            $('#idcat').change(function(){
                                var val = $(this).val();
                                $('#idcat2').html('');
                                $.ajax({
                                type: 'POST',
                                url: 'show.php',
                                data: {'model': val},
                                success: function(data) {
                                    var obj = JSON.parse(data);
                                    obj.forEach(function(item) {
                                        $('#idcat2').append($("<option>  </option>")
                                                    .attr("value",item).text(item)); 
                                    });
                                }
                                });
                            });
                    </script>

         //файл show.php

        <? php
        $hostname = "localhost"; 
        $username = "***"; 
        $password = "***"; 
        $dbName = "***"; 

        mysql_connect($hostname, $username, $password) or die ("Не могу  создать соединение");
        mysql_query('SET NAMES utf8') or header('Location: Error');

        mysql_select_db($dbName) or die (mysql_error());

        $MODEL = $_POST['model'];

       //Не забываем что должна быть обработка $MODEL
       //что-бы всякие хацкеры не могли сломать
       //например всякие mysqli_escape_string
       //если юзаем PDO prepare-execute, он сделает это за нас

          if (isset($MODEL) && ! empty($MODEL)) {
          //  Используя нашу $MODEL нужно сделать
          $query = "SELECT DISTINCT model FROM filtr_db";
          $DB = mysql_query($query);
       //  запрос к БД, который вернет массив типа:
          $DB[0]['model'] = 'camry';
          $DB[1]['model'] = 'raw4';
          $DB[2]['model'] = 'corolla';
           //  Обработаем
           $DB = array_column($DB, 'model');
          // Обрабатываем потому, что нам нужен такой массив:
            // array('camry', 'raw4', 'corolla')
          //  Выводим
        echo json_encode($DB);
         } else {
          echo '[]';
        }
      ? >

A:

Я лишь покажу в общих чертах, как это все должно выглядеть и работать, допилите до совершенства сами:
Итак, у нас есть HTML:
<html>
<head></head>
<body>
    <!--  Наш исходный idcat -->
    <select id="idcat">
    <option selected disabled>Выберете марку</option>
    <option value="toyota">toyota</option>
    <option value="lada">lada</option>
    </select>
    <!--  Второй idcat, всплывающий -->
    <select id="idcat2" style="display: none;">
    </select>

    <!--  JS -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
    <script type="text/javascript">
        $('#idcat').change(function(){
            var val = $(this).val();
            $('#idcat2').show();
            $('#idcat2').html('');
            $.ajax({
            type: 'POST',
            url: 'test.php',
            data: {'model': val},
            success: function(data) {
                var obj = JSON.parse(data);
                obj.forEach(function(item) {
                    $('#idcat2').append(new Option(item, item));
                    // либо так
                    //$('#idcat2').append($("<option></option>")
                    //            .attr("value",item).text(item)); 
                });
            }
            });
        });
    </script>
</body>
</html>

При выборе первого селекта, отправляется ajax на test.php который выглядит как-то так:
<? php

$MODEL = $_POST['model'];

//Не забываем что должна быть обработка $MODEL
//что-бы всякие хацкеры не могли сломать
//например всякие mysqli_escape_string
//если юзаем PDO prepare-execute, он сделает это за нас

if (isset($MODEL) && ! empty($MODEL)) {
    //  Используя нашу $MODEL нужно сделать
    //  запрос к БД, который вернет массив типа:
    $DB[0]['model'] = 'camry';
    $DB[1]['model'] = 'raw4';
    $DB[2]['model'] = 'corolla';
    //  Обработаем
    $DB = array_column($DB, 'model');
    // Обрабатываем потому, что нам нужен такой массив:
    // array('camry', 'raw4', 'corolla')
    //  Выводим
    echo json_encode($DB);
} else {
    echo '[]';
}

Все это дело рабочее, до красотульки доведете сами.