Question

我有3个下拉列表，其中包含我想按升序排序的地方列表。使用codeigniter活动记录order_by函数对地点的第一个下拉列表进行排序，并按升序顺序对地点进行排序。但是，使用onchange javascript函数，当我在第一个下拉列表中选择一个地点时，请填充除了我在第一个下拉列表中选择的地点的第二个下拉列表，返回的地点没有按升序排序，即使我的查询中有order_by函数。我怀疑这是因为在onchange中返回的json格式化数据。这是我的代码。谢谢你的帮助。

此代码按升序正确排序数据

function get_dropdown_barangay(){

  $query = $this->db->select('ID,brgy_name')
                    ->from('tbl_barangay')
                    ->order_by('brgy_name','asc')
                    ->get()
                    ->result_array();
  $dropdown = array('0'=>'Select Barangay');
  foreach($query as $value){
    $dropdown[$value['ID']] = $value['brgy_name'];
  }

  return $dropdown;

}

输出图片： enter image description here

更改代码，返回的地点不按升序排序

$('#brgy_id_1').change(function(){

    var brgy_id = $("#brgy_id_1").val();
    alert(brgy_id);
    var data_val = {'brgy_id':brgy_id};

    $.ajax({
         type: "POST",
         url:"<?php echo base_url();?>admin/get_barangay_list",
         data:data_val,
         dataType:'json',
         success: function(data)
          {
           $('#brgy_id_2').empty();
           $.each(data,function(id,val)
           {
                var opt = $('<option />'); // here we're creating a new select option for each group
                  opt.val(id);
                  opt.text(val);
                  $('#brgy_id_2').append(opt);
            });
           }
     });

 }); //end change

admin.php的

function get_barangay_list(){

      if(isset($_POST['brgy_id2'])){
        $brgy_array_id = array('0'=>$_POST['brgy_id'],'1'=>$_POST['brgy_id2']);
      } else{
        $brgy_array_id = array('0'=>$_POST['brgy_id']);
      }

      $result=$this->core_model->get_barangay_list($brgy_array_id);
      $this->output->set_header('Content-Type: application/json',true);
      echo json_encode($result);
    }

model.php

function get_barangay_list($brgy_array_id){

  $query = $this->db->select('ID,brgy_name')
                    ->from('tbl_barangay')
                    ->where_not_in('ID',$brgy_array_id)
                    ->order_by('brgy_name','asc')
                    ->get()
                    ->result_array();
  $dropdown = array('0'=>'Select Barangay');
  foreach($query as $value){
    $dropdown[$value['ID']] = $value['brgy_name'];
  }

  return $dropdown;

}

显示数据的输出图像未按升序排序

enter image description here

Answer 1

实施kinghfb评论的一种方法：

在服务器端：构建一个数组

$dropdown = array();
$dropdown[] = array('id' => 0, 'label' => 'Select city');
for ($query as $value) {
    $dropdown[] = array('id' => $value['ID'], 'label' => $value['brgy_name']);
}

在客户端（javascript）：更改循环代码：

$.each(data,function(id,val) {
    var opt = $('<option />'); // here we're creating a new select option for each group
    opt.val(val.id);
    opt.text(val.label);
    $('#brgy_id_2').append(opt);
});

Answer 2

您在这里丢失订单，因为您正在设置新密钥（问题在此处描述Change array key without changing order）。因此，您必须保留密钥，因此您必须更改js部分，因为您无法再使用键值访问数据。

function get_dropdown_barangay(){

$query = $this->db->select('ID,brgy_name')
                ->from('tbl_barangay')
                ->order_by('brgy_name','asc')
                ->get()
                ->result_array();
$dropdown = array('0'=>'Select Barangay');
foreach($query as $value){
 $dropdown[] = array("id" => $value["ID"], "name" => $value['brgy_name']); // setting new value and keep an numeric key which represents the order
 }

  return $dropdown;

 }

和js必须像：

$('#brgy_id_1').change(function(){

    var brgy_id = $("#brgy_id_1").val();
    alert(brgy_id);
    var data_val = {'brgy_id':brgy_id};

    $.ajax({
         type: "POST",
         url:"<?php echo base_url();?>admin/get_barangay_list",
         data:data_val,
         dataType:'json',
         success: function(data)
          {
           $('#brgy_id_2').empty();
           $.each(data,function(object)
           {
                var opt = $('<option />'); // here we're creating a new select option for each group
                  opt.val(object.id);
                  opt.text(object.value);
                  $('#brgy_id_2').append(opt);
            });
           }
     });

 });

我已经突出显示了这些变化，但我不知道在SO的代码中使用粗体......

Answer 3

您可以使用underscore

对JSON进行排序

只需传入您的JSON和排序功能即可。像这样：

var cityJSON = [{city: 'San Vinente'}, {city: 'Pequnio'}, {city: 'Pili Drive'}, {city: 'Jc Aquino'}, {city: 'Banza'}];
console.log(cityJSON); // unsorted
cityJSON = _.sortBy(cityJSON, function(item){return item.city});
console.log(cityJSON); // sorted

如何使用javascript对json类型数据进行排序？

3 个答案: