0

我在拖动项目时遇到了一些麻烦。如果该项目位于项目根目录的下方,我只能拖放它。

我想自由地拖动项目,例如,我想拖动 4 的最后一个项目并将其放在首位,在顶部。

我能做什么和不能做什么的例子

Bellow 是在 Laravel Livewire 应用程序中完成的 jquery 代码。

<div class="parameters-bars list-group-flush menu-sort-container" style="border: none;background: none">
    <ol class="dd-list card-header">

        @foreach($parentParameters as $parameter)
            <li class="dd-item list-group-item" data-id="{{$parameter->id}}" style="border:none;background:none">
                <div class="dd-handle">
                    {{$parameter->name->{getLang()} }}

                    @if($deleted_status == 'false')
                        <span class="badge badge-light badge-pill float-right dd-nodrag">
                            <button class="form-delete-parameter" parameter-id="{{$parameter->id}}" style="border: none;background: none">
                                <i class="fas fa-trash-alt"></i>
                            </button>
                        </span>
                        <span class="badge badge-light badge-pill float-right dd-nodrag"><a href="{{route('parameters.show',['id' => $parameter->id])}}">
                                <button class="form-view" style="border: none;background: none">
                                    <i class="fas fa-eye"></i>
                                </button>
                            </a>
                        </span>
                    @else
                        <span class="badge badge-light badge-pill float-right dd-nodrag">
                            <button class="form-restore-parameter" parameter-restore-id="{{$parameter->id}}" style="border: none;background: none">
                                <i class="fas fa-trash-restore-alt"></i>
                            </button>
                        </span>
                    @endif

                </div>

                @if($parameter->subcategory and $parameter->subcategory->count())
                    <ol class="dd-list list-group card-header">
                        @include('catalogs::livewire.subcatalogs',['subcategories' => $parameter->subcategory])
                    </ol>
                @else
            </li>
            @endif
        @endforeach

    </ol>
</div>

Bellow 是在 Laravel Livewire 应用程序中完成的 jquery 代码。

$('.parameters-bars').nestable({
                maxDepth:10,
                //handleClass:'dd-handle',
                //expandBtnHTML: '<button data-action="expand"><i class="fas fa-grip-vertical"></i>></button>',
                //collapseBtnHTML: '<button data-action="collapse">Collapse</button>',
                callback: function(l,e){
                    var _arr = $('.parameters-bars').nestable('toArray');
                    console.log('Parameters-bars', _arr)
                    $.ajax({
                        type: "POST",
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        url: "parameters/updateorder",
                        data:{arr:_arr},
                        //contentType: 'application/json',
                        dataType:'json',
                        success: function(data)
                        {
                            //console.log(data.success);
                            //alert('success');
                        },
                        error: function(error){
                            console.log(error.fail);
                            //alert('fail');
                            //location.reload();
                        }
                    })
                }
            });
        });
4

0 回答 0