Php Laravel/Javascript：在选择不同的选择/下拉列表后填充选择/下拉列表

我正在寻找一种解决方案，以便在从另一个下拉列表（例如下拉列表1）中选择选项时填充下拉列表/选择列表（例如称为下拉列表2）

例如，从下拉列表1中选择Toyota将在下拉列表2中填充Toyota车型，例如Corolla、Camry等。或者另一个示例-在一个下拉列表中选择一个国家将在另一个下拉列表中填充该国的不同城市

我使用laravel作为我的框架，所以我的解决方案（a）在laravel中工作，（b）从mysql数据库获取结果，而不仅仅是硬编码的值数组，这一点很重要

我在这里尝试实现了一个解决方案：

但它在我的设置范围内不起作用。这就是我所拥有的：

我的观点是这样的：

{{ Form::open() }}
    <select id="make" name="make">
        <option>Select Car Make</option>
        <option value="1">Toyota</option>
        <option value="2">Honda</option>
        <option value="3">Mercedes</option>
    </select>
    <br>
    <select id="model" name="model">
        <option>Please choose car make first</option>
    </select>
{{ Form::close();}}

jQuery(document).ready(function($){
$('#make').change(function(){
        $.get("{{ url('api/dropdown')}}", 
            { option: $(this).val() }, 
            function(data) {
                var model = $('#model');
                model.empty();

                $.each(data, function(index, element) {
                    model.append("<option value='"+ element.id +"'>" + element.name + "</option>");
                });
            });
    });
});

Route::resource('clients', 'ClientsController');

Route::resource('tasks', 'TasksController');

Route::controller('rates', 'RatesController');

Route::controller('projects', 'ProjectsController');

Route::controller('users', 'UserManagementController');

Route::controller('/', 'UsersController');

Route::get('api/dropdown', function(){
    $input = Input::get('option');
    $maker = Client::find($input);
    $models = $maker->projects();
    return Response::eloquent($models->get(array('id','name')));
});

最后，我的脚本如下所示：

{{ Form::open() }}
    <select id="make" name="make">
        <option>Select Car Make</option>
        <option value="1">Toyota</option>
        <option value="2">Honda</option>
        <option value="3">Mercedes</option>
    </select>
    <br>
    <select id="model" name="model">
        <option>Please choose car make first</option>
    </select>
{{ Form::close();}}

jQuery(document).ready(function($){
$('#make').change(function(){
        $.get("{{ url('api/dropdown')}}", 
            { option: $(this).val() }, 
            function(data) {
                var model = $('#model');
                model.empty();

                $.each(data, function(index, element) {
                    model.append("<option value='"+ element.id +"'>" + element.name + "</option>");
                });
            });
    });
});

Route::resource('clients', 'ClientsController');

Route::resource('tasks', 'TasksController');

Route::controller('rates', 'RatesController');

Route::controller('projects', 'ProjectsController');

Route::controller('users', 'UserManagementController');

Route::controller('/', 'UsersController');

Route::get('api/dropdown', function(){
    $input = Input::get('option');
    $maker = Client::find($input);
    $models = $maker->projects();
    return Response::eloquent($models->get(array('id','name')));
});

我相信我有CSRF令牌，这显然可能会影响事情-但我真的不知道如何使用它们，所以只是告诉我如何修复它不会有帮助，我真的需要一点关于如何修复它的细节（如果你认为这是问题的话）

或者，也许一个改进的或更好的解决方案会更好？我相信有很多更好的方法来实现这种解决方案

总之，我的问题是：在另一个下拉列表中选择一个选项后，如何修复上面的代码以使其正常工作，或者有什么替代或更好的方法来填充下拉列表？

我已经倾注了数百种解决方案，但似乎没有一种对我和我的生活有用

编辑：

完整路线如下所示：

{{ Form::open() }}
    <select id="make" name="make">
        <option>Select Car Make</option>
        <option value="1">Toyota</option>
        <option value="2">Honda</option>
        <option value="3">Mercedes</option>
    </select>
    <br>
    <select id="model" name="model">
        <option>Please choose car make first</option>
    </select>
{{ Form::close();}}

jQuery(document).ready(function($){
$('#make').change(function(){
        $.get("{{ url('api/dropdown')}}", 
            { option: $(this).val() }, 
            function(data) {
                var model = $('#model');
                model.empty();

                $.each(data, function(index, element) {
                    model.append("<option value='"+ element.id +"'>" + element.name + "</option>");
                });
            });
    });
});

Route::resource('clients', 'ClientsController');

Route::resource('tasks', 'TasksController');

Route::controller('rates', 'RatesController');

Route::controller('projects', 'ProjectsController');

Route::controller('users', 'UserManagementController');

Route::controller('/', 'UsersController');

Route::get('api/dropdown', function(){
    $input = Input::get('option');
    $maker = Client::find($input);
    $models = $maker->projects();
    return Response::eloquent($models->get(array('id','name')));
});

---

那篇教程是为Laravel3写的，所以有些东西会有所不同。您可以看出这一点，因为有些方法是在snake_案例中，而不是在camelCase案例中

returnresponse:：json（$models->select（array（'id'，'name'））->get（））

---

这将返回一个可由Javascript使用的有效json响应。但是，如果遵循该教程，则可能还需要对模型进行一些编辑

属于

应该是

属于

并且

有很多

应该是

有很多

在Laravel中定义路线的顺序至关重要。有时你会挠头，想知道为什么你会得到一个HttpNotFoundException。考虑您的例程.PHP文件。 当您像

route:：controller（'/'，'userscocontroller'）这样定义路由时，在简单语言中，它的贪婪路由将不允许在此路由下定义的路由执行，因此当您定义此类型的路由时，请确保其位于末尾

所以对你的路线做一些改变，比如

Route::get('api/dropdown', function(){
$input = Input::get('option');
$maker = Client::find($input);
$models = $maker->projects();
return Response::eloquent($models->get(array('id','name')));
});
Route::controller('/', 'UsersController');

直接执行
http://localhost/test-project/api/dropdown?option=1
在浏览器中，尝试将
$.get（{{url（'api/dropdown'）}}}
更改为
$.get（“api/dropdown”）
Hi@TryingTobemyselfRahul非常感谢您的回复-我尝试了您所说的，但没有解决问题，当我直接转到测试项目/api/等的url时，它给了我一个“找不到控制器方法”exception@TryingTobemyselfRahul更新了一个截图，如果有帮助的话？@TryingTobemyselfRahul我们开始了：）我通过添加：return-Response:：json（$models->select（array（'id'，'name'））->get（））进行了更改，并在我的模型中进行了这两个更改，但仍然不起作用-我从未使用过Laravel 3，所以我不知道不同的语法-你知道该教程是否还有语法问题吗？：）我实际上得到了一个对非对象上的成员函数projects（）的调用“当我转到localhost/test project/api/下拉列表时出现异常，如果该帮助确实有用。您是否介意更新您的原始问题，以包括您的客户模型的代码？我假设您的数据库的设置与教程中的设置完全相同？谢谢，但我通过尝试解决了这个问题。这是Laravel3代码的一个问题，但它也帮助我在我的路线中发现了一个巨大的错误。非常感谢你抽出时间，我真的很感激。