根据第一个选择值（车辆模型） - codeigniter填充数据库中的第二个选择

what i'm trying to do here is to populate the second (car models) when someone select car mark from the first select input.

I have in my database for the car models:

list_vehicle_models -  models table
[id] [mark_id] [value_model]

And for the marks

list_vehicle_marks - marks table
[id] [value]

Here is my controller where is expected to receive ajax request with ID based on the list_vehicle_marks value :

function models($mark_id){

        $this->db->select();
        $this->db->from('list_vehicle_models');
        $this->db->join('list_vehicle_marks','list_vehicle_models.mark_id = list_vehicle_marks.id');
        $this->db->where('list_vehicle_marks.id',$mark_id);         
        $query = $this->db->get()->result_array();

        return $query;    
    }

(no need for this contoller function sample beacuase works okay.) Here is my view here i have foreach to populate the mark vehicles and when someone select some mark to be executed in the second select input based on the mark id which i put in the value on the select:

                               <select name="mark_vehicles" id="mark_vehicles">    
                    <option value="value1">-select-</option>
                    <?php foreach($vehicle_mark as $mark){ ?>
                    <option value="<?php echo $mark['id']; ?>">
                                    <?php echo $mark['value']; ?></option>
                    <?php } ?>                      
                       </select>        

            <select name="mark_models" id="mark_models">                
                    <option value=""></option>                  
            </select>

So my question is how to send ajax or jquery post request when someone select ex. Audi on the second select box to be executed All audi models from the database based on list_vehicle_models.

Thanks.

Waiting for some help.

You need to bind to the onChange event of mark_vehicles. With jQuery, this would be:

$("#mark_vehicles").change(function() {
   var selectedMark = $("mark_vehicles").val();
   if (selectedMark != "") {
      $.ajax({
         type: "GET",
         url: "<controller>/models/" + selectedMark,
         success: function(data) {
            $("mark_models").html("");
            $("mark_models").append("<option value=''></option>");
            $.each(data, function() {
               $("mark_models").append("<option value='" + this.id + "'>" + this.value + "</option>");
            });
         }
      });
   }
});

Documentation on using jQuery to issue an AJAX call is here.