How to connect two columns from the table to the selected column showing only related results? Php, Javascript, Jquery

Question

First look my database. https://imgur.com/QWgN9UA Marka and model is only important for you. When user select 'AJP' marka, I need only show him model for that mark. Example when select from dropdown AJP get model "PR4 125 ENDURO" , PR4 125 SUPERMOTOAD" and "PR4 200". I already do anythink but I show user all model from database I need to show only related for selected mark. I show my code , I would like someone to help me without much change of the existing code, if possible.

My Php code to get Marka

public function get_marka_data() {

    $query = $this->db->query("
        SELECT DISTINCT mo.marka
        FROM " . DB_PREFIX .  "model mo
        GROUP BY mo.marka
    ")->rows;

    $data = array_map(function($row){
        return array('value'=>$row['marka'],'label'=>$row['marka']);
    }, $query);

    if (isset($this->request->server['HTTP_ORIGIN'])) {
        $this->response->addHeader('Access-Control-Allow-Origin: ' . $this->request->server['HTTP_ORIGIN']);
        $this->response->addHeader('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
        $this->response->addHeader('Access-Control-Max-Age: 1000');
        $this->response->addHeader('Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With');
    }
    $this->response->addHeader('Content-Type: application/json');
    $this->response->setOutput(json_encode($data));
}

My code for retrieve model

public function get_model_data() {
    $query = $this->db->query("
        SELECT DISTINCT mo.model
        FROM " . DB_PREFIX .  "model mo
        GROUP BY mo.model
    ")->rows;

    $data = array_map(function($row){
        return array('value'=>$row['model'],'label'=>$row['model']);
    }, $query);

    if (isset($this->request->server['HTTP_ORIGIN'])) {
        $this->response->addHeader('Access-Control-Allow-Origin: ' . $this->request->server['HTTP_ORIGIN']);
        $this->response->addHeader('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
        $this->response->addHeader('Access-Control-Max-Age: 1000');
        $this->response->addHeader('Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With');
    }
    $this->response->addHeader('Content-Type: application/json');
    $this->response->setOutput(json_encode($data));
}

My code in template file for fetch that data with ajax

<script type="text/javascript">

   $.ajax({
    url: 'index.php?route=api/reifenmontage/get_marka_data',
   context: document.body,
   success: function(data) {
   const selectControl = $('#result');
     selectControl.html(data.map(ExtractData).join(''));
   }
   });

   function ExtractData(item) {
 return ` <option value="${item.value}">${item.label}</option>`;
}

</script>
<script type="text/javascript">

$.ajax({
url: 'index.php?route=api/reifenmontage/get_model_data',
context: document.body,
success: function(data) {
     const selectControl = $('#result2');
     selectControl.html(data.map(ExtractData).join(''));
   }
});

 </script>

And finally my template html

       <div id="additionalRow"  class="row termin_row">
          <div class="col-sm-4 col-xs-12">
            <div class="row"><label>Marke und model</label></div>
          </div>
              <div class="col-xs-12 col-sm-3" style="margin-right:30px;">
                <div class="row">
                 <select class="form-control"  id="result">
                  </select>
             </div>
         </div>
         <div class="col-xs-12 col-sm-4">
             <div class="row">
               <select class="form-control"  id="result2">
             </select>
          </div>
               </div> 
        </div>

Answer 1

Problem is in the query, instead of GROUP BY... , use WHERE m.marka = '', pass the marka to the script.

First render the markas to the page, when some marka is selected send the request to the server (first add first parameter to the function get_marka_data($marka)) with this query

SELECT DISTINCT mo.marka
FROM " . DB_PREFIX .  "model mo
WHERE mo.marka = " . $marka

When you get the response render it to the page in some dropdown

Don't forget to validate!!