sorting data using dropdown ajax in codeigniter - ajax

Question

i want to sorting data and display the result in the view. I'm using codeigniter framework. What i want is to sorting data using ajax when dropdown values change.
Can someone give me the example code ?
my ajax
<script>
$(document).ready(function() {
$("#selectBerdasar").change(function() {
var key = $(this).val();
console.log(key);
var postdata = {key: key};
var url = '<?php echo site_url('produk/filter/GetFilterJson');?>';
$.post(url, postdata, function(result) {
console.log(result);
if (result) {
var obj = JSON.parse(result);
$('.col-item').empty();
$.each(obj, function(key, line) {
});
} else {
}
});
});
});
my controller
public function doFilter($key) {
$this->load->helper('url');
$this->load->model('filter_model', 'filter');
if ($key == 'termahal') {
$data = $this->filter->getDataMahal($key);
} elseif ($key == 'termurah') {
$data = $this->filter->getDataMurah($key);
} else {
$data = $this->filter->getDataAlfabet($key);
}
return $data;
}
public function GetFilterJson() {
$key = $this->input->post('key');
$data = $this->doFilter($key);
echo json_encode($data);
}
my model
public function getDataMahal($key) {
$this->db->select("*");
$this->db->from("produk");
$this->db->order_by("harga_produk", "desc");
$data = $this->db->get();
return $data->result_array();
}
public function getDataMurah($key) {
$this->db->select("*");
$this->db->from("produk");
$this->db->order_by("harga_produk", "asc");
$data = $this->db->get();
return $data->result_array();
}
public function getDataAlfabet($key) {
$this->db->select("*");
$this->db->from("produk");
$this->db->order_by("nama_produk", "asc");
$data = $this->db->get();
return $data->result_array();
}

Answer 1

here is a simple example. hope this helps..
Ajax
var phone_number = $(this).find('div.number').text();
$("#recipentno").val(phone_number);
$.ajax({
type:"POST",
dataType: 'json',
url:"<?php echo base_url('administrator/get_all_sms/'); ?>",
data: {number: phone_number},
success: function(data) {
//console.log(data);
$(".smsmessage").html("");
console.log(data.total);
for (var i = 0; i < data.total.length; i++) {
if(data.total[i].message_type==1){
$('<div class="col-lg-8 col-lg">'+
'<div class="media">'+
'<div class="" style="border-radius: 25px; background: #4CC1ED; padding: 1px; width: 100%; margin-top: 10px;">'+
'<p style="color: #000000; padding-top: 10px; padding-left: 10px;padding-right: 10px; font-size: 18px;">'+ data.total[i].body+'<i style="font-size: 9px;">'+data.total[i].date_time+'</i></p>'+
'</div>'+
'</div>'+
'</div>').appendTo (".smsmessage");
} else{
$('<div class="col-lg-offset-4 col-lg-8">'+
'<div class="media">'+
'<div class="" style="border-radius: 25px; background: #65CFBF; padding: 1px; width: 100%; height: 50px; margin-top: 10px;">'+
'<p class="sender-img pull-right" style="color: #000000; padding-top: 10px; padding-left: 10px;padding-right: 10px; font-size: 18px;">'+data.total[i].body+'<i style="font-size: 9px;">'+data.total[i].date_time+'</i></p>'+
'</div>'+
'</div>'+
'</div>').appendTo (".smsmessage");
}
}
}
});
Controller
function get_all_sms(){
$pon_number = $this->input->post('number');
$single_sms= $this->admin->get_all_sms_for_number($pon_number);
echo json_encode(array( 'total'=> $single_sms));
}