Laravel-admin 弹出表单 Form select()->load()失效

问题

我在grid创建了自定义操作（审核），使用弹出表单的形式进行操作
表单内容中有select二级联动的操作，父级初始化成功，当改变低级时network有请求，也有相应返回结果，可是子级select并没有被渲染，显示的还是no results found

代码如下

列表 grid

$grid->actions(function($actions) {
    // 添加审核操作
    $actions->add(new Audit());
 });

Actions/Audit.php

<?php
namespace App\Admin\Actions;
use Encore\Admin\Actions\Response;
use Encore\Admin\Actions\RowAction;
use Encore\Admin\Facades\Admin;
use Illuminate\Http\Request;
/**
 * Class ChangeGoodsButton
 * @package App\Admin\Actions\Sales
 */
class ChangeGoodsButton extends RowAction
{
    public $name = '换货';
    /**
     * @param Model $model
     * @param Request $request
     * @return Response
     */
    public function handle(Model $model, Request $request)
    {
        // ToDo
        return $this->response()->success('审核操作成功！')->refresh ();
    }
    public function form()
    {
        $this->select('goods_id_' . $this->getKey(), __('GoodsName'))
            ->options('/api/have-inventory-goods')
            ->default($this->row['goods_id'])
            ->load('inventory_id_' . $this->getKey(), '/api/inventory-by-goods');
        $this->select('inventory_id_' . $this->getKey(), __('InventoryChoose'));
    }
}

页面html渲染结果

Laravel-admin 弹出表单 Form select()->load()失效

页面js渲染结果

Laravel-admin 弹出表单 Form select()->load()失效

可以看到渲染结果没有问题，而且当goods_id_21 change的时候查看network也是有请求的

Laravel-admin 弹出表单 Form select()->load()失效

但是inventory_id_21并没有渲染出返回结果，提示的还是no results found

Laravel-admin 弹出表单 Form select()->load()失效

还请帮忙看下这是什么导致的呢

StriveBoy

11 声望

暂无个人描述~

3 人点赞

从零开发一个电商项目，功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等

你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程，JWT 概念及使用和 API 开发相关的进阶知识。

原因

经过与正常组件的对比发现，弹出表单字段外层div的class没有fields-group标识，导致js获取不到子级select。

// 文件地址 /vendor/encore/laravel-admin/resources/views/actions/form/modal.blade.php

<div class="modal" tabindex="-1" role="dialog" id="{{ $modal_id }}">
    <div class="modal-dialog {{ $modal_size }}" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">{{ $title }}</h4>
            </div>
            <form>
            <div class="modal-body fields-group"> // 在这里加上fields-group
                @foreach($fields as $field)
                    {!! $field->render() !!}
                @endforeach
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{{ __('admin.close') }}</button>
                <button type="submit" class="btn btn-primary">{{ __('admin.submit') }}</button>
            </div>
            </form>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

OK,成功！唯一不好的就是要更改源码~

4年前评论

讨论数量: 6

StriveBoy

11 声望

自己搞了半天，奈何前端知识有限，也没解决，然后加入了官方讨论群，感谢群友@野草的提示，才找到原因，顺利解决问题。

原因

经过与正常组件的对比发现，弹出表单字段外层div的class没有fields-group标识，导致js获取不到子级select。

// 文件地址 /vendor/encore/laravel-admin/resources/views/actions/form/modal.blade.php

<div class="modal" tabindex="-1" role="dialog" id="{{ $modal_id }}">
    <div class="modal-dialog {{ $modal_size }}" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">{{ $title }}</h4>
            </div>
            <form>
            <div class="modal-body fields-group"> // 在这里加上fields-group
                @foreach($fields as $field)
                    {!! $field->render() !!}
                @endforeach
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{{ __('admin.close') }}</button>
                <button type="submit" class="btn btn-primary">{{ __('admin.submit') }}</button>
            </div>
            </form>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

OK,成功！唯一不好的就是要更改源码~

4年前评论

gyp719

课程读者 273 声望

厉害。

4年前评论

fanren

课程读者 6 声望

用js追加一个 class 也可以

3年前评论

fanren

课程读者 6 声望

// modal-body添加 fields-group addSelectLinkage: function () { var dom = document.getElementsByClassName("modal-body"); if (dom) { for (var i = 0; i < dom.length; i++) { if (dom[i].classList.contains("fields-group") === false) { dom[i].classList.add("fields-group"); } } } }

3年前评论

longyuan

课程读者 0 声望

厉害

2年前评论

qingyan233

课程读者 9 声望 / 搬砖 @ 工地

大佬牛逼，不知道哪个版本修复了，目前1.8.11还是有问题

1年前评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容，与人为善，比聪明更重要！

帮助

Laravel-admin 弹出表单 Form select()->load()失效

问题

代码如下

推荐文章：

原因

原因

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

Laravel-admin 弹出表单 Form select()->load()失效

问题

代码如下

推荐文章：

原因

原因

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

请登录