Question

大家好我有问题。我不知道如何解决它。我是ajax处理的初学者。我希望你能帮助我。

我有成功的ajax数据。我想把它放在一个数组中。因为我想将json数据放在选项框中。

这是我的代码：

在我的控制器中我有这个

$('#state').on('change',function(){

            var state_code = $('#state').val();

            var city_url = '<?php echo site_url("locations/displayCity/' + state_code + '"); ?>';

            $.ajax({

                type: 'POST',
                url: city_url,
                data: '',
                dataType: 'json',
                async: false,
                success: function(i){

                    console.log(i)

                }

            });

        });

这是我需要使用json数据填充的选择框选项

<select id="city" name="city">
    <option value="">---Select City---</option>
</select>

这是json的回应

[{"id":"1054","name":"Altavas"},{"id":"1055","name":"Balete"},{"id":"1056","name":"Banga"},{"id":"1057","name":"Batan"},{"id":"1058","name":"Buruanga"},{"id":"1059","name":"Ibajay"},{"id":"1060","name":"Kalibo"},{"id":"1061","name":"Lezo"},{"id":"1062","name":"Libacao"},{"id":"1063","name":"Madalag"},{"id":"1064","name":"Makato"},{"id":"1065","name":"Malay"},{"id":"1066","name":"Malinao"},{"id":"1067","name":"Nabas"},{"id":"1068","name":"New Washington"},{"id":"1069","name":"Numancia"},{"id":"1070","name":"Tangalan"}]

在我的console.log中，我有这个：

[Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object]
0: Object
1: Object
2: Object
3: Object
4: Object
5: Object
6: Object
7: Object
8: Object
9: Object
10: Object
11: Object
length: 12

proto ：数组[0]

如果我点击对象中的箭头，我会得到这个：

Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object]
0: Object
id: "1028"
name: "Butuan City"
__proto__: Object
1: Object
id: "1029"
name: "Buenavista"
__proto__: Object
2: Object
3: Object
4: Object
5: Object
6: Object
7: Object
8: Object
9: Object
10: Object
11: Object
length: 12
__proto__: Array[0]

那是所有人。感谢。

Answer 1

只需替换

success: function(i){
    console.log(i)
}

与

success: function(data){
    $.each($.parseJSON(data),function(index,value){
        $('#city').append('<option value="'+value.id+'">'+value.name+'</option>');
    });
}

Answer 2

您的回复已经是一个数组。只需使用jQuery.each(i, function(index, item) {...})

进行迭代即可

Answer 3

使用此 -

$.each(i, function(key,val){

 $('#city').append("<option value='" + key + ">" + val + "</option>");

});

Answer 4

  function(i){

     $.each(i,function(index,value){ 
       $("#city").append("<option value='"+value.id+"'>"+value.name+"</option>")
     });
  }

Answer 5

不要使用追加这样每次追加选择框首先制作一个字符串然后在选择框中设置完整的html它快速然后追加

var str='';
$.each(i, function(index,value){
str +="<option value='"+value.id+"'>"+value.name+"</option>";


});
 $('#city').html(str);

Answer 6

我了解你何时console.log(i);你得到了正确的回应。现在你需要做的是JSON.parse对象，然后在select选项上设置它。

凭借我的经验，这是棘手的部分，因为选择选项不能由html自动设置。

所以这里可能是一些可用的代码（如果你想要一些前缀）。

$(document).ready(function () {
    var size =    $('select').children('option').length;
    for (i=0;i<size;i++)
    {
        if ( $('select').children('option')[i].value === resultingObj.whatever)
        {
             $('select').children('option')[i].selected=true;
        }
    }
});

祝你好运

Answer 7

尝试这样的事情

    $.ajax({
           type: 'POST',
           url: city_url,
           data: '',
           dataType: 'json',
           async: false,
           success: function(response){
            var resp_length = response.length;
            var option = '';
            for(var i = 0; i< resp_length;i++){
                option += '<option value="'+response[i].id+'">'+response[i].name+'</option>';
            }
            $('#city').append(option);//Opertation on DOM only one time.
           }
       });

Answer 8

使用以下脚本

$.ajax({
  ...
  ...
  success: function(response){
    var option = null;
    //iterate each json record
    $(response).each(function(index, record){

      //create option tag with value and record name
      option = $('<li>').attr('value', record.id).html(record.name);

      //append this option tag to select box
      $('#city').append(option);
    });
  }

});

Answer 9

首先将你的json解析为object然后使用$ .each

success: function(i){
    json = JSON.parse(i);
    $.each(json,function(index,value){
        $('#city').append('<option value="'+value.id+'">'+value.name+'</option>');
    });
}

Answer 10

试试这个 -

var select=$('#city');
for (var j=0; j<i.length; j++)
{
   select.append('<option value="'+i[j].id+'">'+i[j].name+'</option>');
}

Answer 11

从您的代码中我修改了它以执行您想要的操作。

success: function(i)
{
var resultingObj = JSON.parse(i);

    for(var iterator = 0; iterator < resultingObj.length; iterator++)
    {
        //perform actions
        $('#city').append('<option value="' + resultingObj[iterator].id + '">' + resultingObj[iterator].name + '</option>');
    }
}

如何使用循环提取数组中的json数据？

11 个答案: