3 months ago

Drag and Drop sorting

Posted 3 months ago by twg_

I have setup sortable with jQuery UI and I'm able to drag and drop the items in any order I want. What I'm having issues with is saving the order after I move each item.


Route::prefix('manage')->group(function () {
    Route::prefix('pages')->group(function () {
        Route::post('/reposition', '[email protected]');

[email protected]

public function submit(Request $request)

        if ($request->has('item')) {
            $i = 0;

            foreach ($request->get('item') as $id) {
                print_r($id); die();
                $page = \App\Page::find($id);
                $page->menu_order = $i;

            return response()->json(array('success' => true));
        } else {
            return response()->json(array('success' => false));

Blade File (index.blade.php)

<div id="pages">
@foreach($pages as $page)
<div class="page" id="{{ $page->id }}">
    <div class="handle"></div>
    <div class="page-details">

<script src=""></script>
<link rel="stylesheet" href="">
<script src=""></script>
<script type="text/javascript">
        'containment': 'parent',
        'revert': true,
        helper: function(e, div) {
            var $originals = div.children();
            var $helper = div.clone();
            $helper.children().each(function(index) {
            return $helper;
        handle: '.handle',
        update: function(event, ui) {
            var url = '{{ route("pages.reposition", ":id") }}';
            url = url.replace(':id', ui.item.attr('id'));
                function(data) {
                    if (!data.success) {
                        alert('Whoops, something went wrong.');

Please sign in or create an account to participate in this conversation.