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

Posted 2023-03-14

【中文标题】Laravel/Javascript：在选择不同的选择/下拉列表后填充选择/下拉列表

【英文标题】：Laravel/Javascript: populate a select/dropdown after a different select/dropdown is selected

【发布时间】：2013-07-29 02:19:39

【问题描述】：

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

例如，从下拉菜单 1 中选择丰田，然后会在下拉菜单 2 中填充丰田车型，例如卡罗拉、凯美瑞等。或者另一个例子——在一个下拉列表中选择一个国家将在另一个下拉列表中填充该国家的不同城市。

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

我已尝试在此帖子中实施解决方案：http://forums.laravel.io/viewtopic.php?pid=40028

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

我的观点是这样的：

 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();

那么我的 route.php 是这样的：

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

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

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>");
                );
            );
    );
);

我目前在控制台中遇到 javascript 错误：

Failed to load resource: the server responded with a status of 500 (Internal Server Error): http://localhost/test-project/api/dropdown?option=1
Failed to load resource: the server responded with a status of 500 (Internal Server Error): http://localhost/test-project/%7B%7B%20url('api/dropdown')%7D%7D?option=1

我相信我有 CSRF 令牌，这显然可能会影响某些事情 - 但我真的不确定如何使用它们，所以只是告诉我修复它不会有帮助，我真的需要一点细节来说明具体如何解决这个问题（如果您认为这是问题所在）。

或者，也许修改或更好的解决方案会更好？我确信有很多更好的方法可以实现这种类型的解决方案。

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

我已经倾注了数百种解决方案，但似乎没有一个适合我和我的 laravel-ness！

编辑：

完整的路线如下所示：

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')));
);

【问题讨论】：

当您在浏览器中直接执行http://localhost/test-project/api/dropdown?option=1 并尝试将$.get(" url('api/dropdown')" 更改为$.get("api/dropdown" 时会发生什么

嗨@TryingTobemyselfRahul 非常感谢您的回复-我尝试了您所说的但没有解决问题；当我直接转到 test-project/api/ 等的 url 时，它给出了我一个“找不到控制器方法”。异常

@TryingTobemyselfRahul 更新了截图，如果有帮助？

@TryingTobemyselfRahul 好了 :)

【参考方案1】：

在 Laravel 中定义路由的顺序至关重要。有时您会摸不着头脑，想知道为什么您会收到 HttpNotFoundException。考虑您的 routes.php 文件。

当你定义像Route::controller('/', 'UsersController');这样的路由时，用简单的语言它的贪婪路由它不会允许在这个路由下面定义的路由执行，所以当你定义这种类型的路由时，请确保它在末尾​​p>

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

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');

【参考方案2】：

该教程是为 Laravel 3 编写的，所以会有一些不同。你可以看出这一点，因为有些方法是在snake_case而不是camelCase中。

return Response::json($models->select(array('id','name'))->get())

这应该返回一个可供 Javascript 使用的有效 json 响应。但是，如果您遵循该教程，您可能还需要对模型进行一些编辑。 belongs_to 应该是 belongsTo 和 has_many 应该是 hasMany。

【讨论】：

我通过添加进行更改： return Response::json($models->select(array('id','name'))->get()) 并通过在我的模型，仍然无法工作——我从未使用过 Laravel 3，所以我不知道不同的语法——你知道那个教程是否还有语法问题吗？ :)

如果有帮助，当我转到 localhost/test-project/api/dropdown 时，我实际上得到了“调用非对象上的成员函数项目（）”异常

这确实有帮助。您介意更新您的原始问题以包含您的客户端模型的代码吗？我假设您的数据库也完全按照教程中的方式设置？

谢谢你，但我用 Trying 解决了这个问题。这是 laravel 3 代码的一个问题，但 Trying 也帮助我在我的路线中发现了一个巨大的错误。非常感谢您的宝贵时间，我真的很感激。