如何使用JavaScript处理两个json数组对象

时间:2018-09-26 11:30:09

标签: javascript php jquery json ajax

此功能

public function groups_priviledges($user_id = NULL){
    $data['groups'] = $this->priviledges_model->admin_groups();
    $data['member'] = $this->priviledges_model->empAdminGroup($user_id);
    echo json_encode($data);
}

已经在我的浏览器中返回了这个json数组

{
    "groups": [
        {
            "id": "1",
            "description": "Human Resources",
            "added": "2018-06-21 16:27:20",
            "status": "1"
        },
        {
            "id": "2",
            "description": "Purchasing",
            "added": "2018-06-21 16:31:47",
            "status": "1"
        },
        {
            "id": "4",
            "description": "Warehouse",
            "added": "2018-06-21 16:31:47",
            "status": "1"
        }
    ],
    "member": [
        {
            "id": "41",
            "admin_group_id": "4",
            "employee_id": "16"
        }
    ]
}

使用ajax列出所有组时,我面临着严峻的挑战,并且只有成员属于特定组时,才会选中此复选框。

我的html当前看起来很喜欢

<table class="table table-striped">
   <thead>
      <tr>
      <th> Priviledge </th>
      <th> Options </th> 
      </tr>
   </thead>
   <tbody id="priviledges"></tbody>
</table>

我的ajax ...我在这里迷路了,什么也没回来

<script>
$(function(){
    priviledges();

    function priviledges(){

        $.ajax({
            type: 'ajax',
            url: '<?php echo base_url() ?>users/groups_priviledges/<?php echo $tuser['employeeId'] ?>', 
            async: false,
            dataType: 'json',
            success: function(data){
                var html = '';
                var groups;
                for(groups=0; groups<data.length; i++){
                    html += '<tr>'+ 
                                '<td>'+data[groups].description+'</td>'+
                                '<td>'+'<label class="check"><input type="checkbox" name="group[]" class="icheckbox" checked=""/>'+
                             '</tr>';
                }
                $('#priviledges').html(html);
            },error: function(){
                alert('Could not retrieve data');
            }
        });

    }
});

谢谢大家的期待。

1 个答案:

答案 0 :(得分:0)

您的问题是data是一个对象,其中包含一个数组(存储在该对象的“ groups”属性中)。但是,当您编写data.lengthdata[groups]时,您将data本身视为数组,而不是数组。

解决方案是先引用groups对象的data属性,然后再引用其中的特定数组项

var data = {
  "groups": [{
      "id": "1",
      "description": "Human Resources",
      "added": "2018-06-21 16:27:20",
      "status": "1"
    },
    {
      "id": "2",
      "description": "Purchasing",
      "added": "2018-06-21 16:31:47",
      "status": "1"
    },
    {
      "id": "4",
      "description": "Warehouse",
      "added": "2018-06-21 16:31:47",
      "status": "1"
    }
  ],
  "member": {
    "id": "41",
    "admin_group_ids": ["1", "4"],
    "employee_id": "16"
  }
};

var html = '';
for (var count = 0; count < data.groups.length; count++) {
  html += '<tr>' +
    '<td>' + data.groups[count].description + '</td>' +
    '<td>' + '<label class="check"><input type="checkbox" name="group[]" class="icheckbox"';
  for (var ids = 0; ids < data.member.admin_group_ids.length; ids++) {
    if (data.member.admin_group_ids[ids] == data.groups[count].id) {
      html += "checked=checked";
      break;
    }
  }
  html += '/></tr>';
}
$('#privileges').html(html);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-striped">
  <thead>
    <tr>
      <th> Privilege </th>
      <th> Options </th>
    </tr>
  </thead>
  <tbody id="privileges"></tbody>
</table>

在上面我还有:

  • 更正了“特权”的拼写

  • 更正了for循环定义中的错误(未定义i

  • 将循环变量名称更改为“ count”,因此它不会与数据中的“ groups”属性混淆。

  • 假定当成员在多个管理组中时,“ member”的JSON结构现在将更改为有意义,并且将是这样的:"member": { "id": "41", "admin_group_ids": ["1", "4"], "employee_id": "16" }(请参阅下面的评论)< / p>