从Dropbox到另一个Dropbox更改值的AJAX

Question

I have select html tag, which value get from database, and the data will return to query and return an value to another dropbox.

My tag HTML like this:

And i want to give the value of data which is selected to another dropdown here:

And my javascript like this:

And the url direct to here:

And the model like this :

How i can change value to id sektor 20, when i have selecting a dropdown from sektor10?, and how to return value from controller and change value of sektor20?

Answer 1

A working sample what I have done for selecting from dropdown and display values as per the selected value.

In your controller-

function functionname($id){

    $details =  $this->your_model->get_details($id);
    echo  json_encode($details);
    exit;

}

In Model-

function get_details($id){

  $this->db->select('*');
  $this->db->from('packages'); 
  $this->db->where('package_id',$id); 
  $query = $this->db->get()->result();
  return $query;
}

Javascript-

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script  src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){

    $("#sector10").change(function() {
 var selectedMark = $("#sector10").val();
if (selectedMark != "") {
    jQuery.ajax({
       type: 'POST',
      dataType: "json",
       async:false,
        url: "<?php echo base_url() . 'loyalty/functionname/'; ?>" + selectedMark,
       success: function(data)
       {
            $("#cards").html("");
            $("#cards").append("<option value=''>Select a Card</option>");
            var index=1;

            $.each(data, function() {
                $("#cards").append("<option value='" + this.card_id + "'>" + this.card_name + "</option>");
                $("div#cards_chosen div.chosen-drop ul.chosen-results").append("<li class='active-result' data-option-array-index='"+index+"' >" + this.card_name + "</li>");
                index++;
            });
       }
    });
}
});


});
</script>