jquery ajax 传递 2 个数组，然后将它们拆分并在 laravel 中分别使用答案

【问题标题】：jquery ajax passing 2 arrays and then split them and use them separetely in laraveljquery ajax 传递 2 个数组，然后将它们拆分并在 laravel 中分别使用
【发布时间】：2018-01-09 06:14:42
【问题描述】：

当我在视图中更改下拉列表的值时，我通过控制器中的 ajax 调用传递它以返回 2 个数组以更改 laravel 中同一视图中的 2 个其他下拉列表。

控制器代码为：

public function CreatGegCityAjax($id)
{        
    $offices = \App\office::where("city_id",$id)->orderBy('name','asc')->get()->pluck('name','id');
    $chars = \App\Char::where("city_id",$id)->orderBy('name','asc')->get()->pluck('name','id');

    return json_encode(array('offices' => "$offices",'chars' => "$chars"));
}

视图中的代码是

$('select[name="city_id"]').on('change', function() {
        var cityID = $(this).val();

        if(cityID) {
            $.ajax({
                url: '/admin/gegonos/ajax/city/'+cityID,
                type: "GET",
                dataType: "json",                    
                success:function(data) {   

                $('select[name="office_id"]').empty();

                $.each(data, function(key, value) {
                   $('select[name="office_id"]').append('<option value="'+ key +'">'+ value.offices +'</option>');
                });    

                $('select[name="char_id"]').empty();

                $.each(data, function(key, value) {
                   $('select[name="char_id"]').append('<option value="'+ key +'">'+ value.chars +'</option>');
                });    
                }                    
            });
        }else{
            $('select[name="office_id"]').empty();
            $('select[name="char_id"]').empty();
        }
    });

这可以正常工作，但不会在下拉列表中获取值。它显示“未定义”。如何使用右侧下拉列表中的每个数组拆分 json 数据的值？谢谢

【问题讨论】：

请在您的ajax成功回调函数中使用console.log(data)的结果更新问题
console.log(data) 到底应该放在哪里？
在success:function(data) {
我把它和显示办公室：[] chars: []
这意味着您的 eloquent 查询中的 $offices 和 $chars 什么都不返回

标签： javascript jquery arrays ajax laravel

【解决方案1】：

在你的控制器中试试这个：

return response()->json(['offices'=>$offices, 'chars'=>$chars]);

在此处查看有关 Laravel json 响应的信息：http://coursesweb.net/laravel/responses#anc_jre

然后，将console.log(data) 放入success:function 中，在控制台查看收到的响应，并根据其结构进行解析。

【讨论】：

使用这个返回 office: [object Object] chars: [object Object]
非常感谢您的回答帮助我解决了这个问题。

【解决方案2】：

假设您收到来自控制器的json 响应，格式为

{
'offices' : {
        '1' : 'name',
        '2' : 'name'
    },
'chars': {
        '1' : 'name',
        '2' : 'name'
    }
}

您需要将成功回调函数更改为

success: function(data) {

    $('select[name="office_id"]').empty();

    if (Object.keys(data.offices).length) {

        $.each(data.offices, function(key, value) {
            $('select[name="office_id"]').append('<option value="'+ key +'">'+ value +'</option>');
        });

    }

    $('select[name="char_id"]').empty();

    if (Object.keys(data.chars).length) {

        $.each(data.chars, function(key, value) {
            $('select[name="char_id"]').append('<option value="'+ key +'">'+ value +'</option>');
        }); 

    }

}

【讨论】：