使用javascript在我的html选择中填充JSON对象

Question

我是ajax的初学者。 现在我正在使用Laravel 5.4，我想填充我在控制器中查询的城市，以在我的视图中输出。

这是我的代码：

function getCities(province_id) {
    $('#city_id').empty();
    $.ajax({         
         url: "{{ url('city') }}/" +province_id,        
         type: "GET",
         dataType: "JSON",
            success: function(data) {
                var opts = $.parseJSON(data);
                // Use jQuery's each to iterate over the opts value
                $.each(opts, function(i, d) {                    
                    $('#city_id').append('<option value="' + d.city_id + '">' + d.city_name + '</option>');
                });
            }
    }); 
}

在我的控制器中，我有这个：

public function getmycity($province_id) {
        $cities = DB::table('cities')
        ->select('cities.city_id','cities.city_name')
        ->where(['cities.province_id' => $province_id])
        ->get();

        return $cities;
    }

我的网络中已经有一个json对象返回，并且我已经看过所有数据对象。

JSON    
0   Object
city_id 28
city_name   Test City

请帮我把所有内容都放在我的选择中。

我没有错误，但是它没有用查询值填充选择类型。

这是我的看法：

 <div class="form-group">
                <label class="control-label col-sm-4" for="email">City/Municipality :</label>
                <div class="col-sm-8">
                   <select class="form-control" id="city_id" name="city_id">
                        <option>Select city/municipality</option>                   
                    </select>
                </div>
              </div>

Answer 1

尝试像这样在纯数组中更改数据库结果：

$cities = json_decode(json_encode($cities),true);

然后return它：

return $cities;

并且，当您编写dataType：'JSON'时，则无需解析您的响应，您可以尝试不使用var opts = $.parseJSON(data); 像这样var opts = data;

希望这对您有帮助...