使用Laravel 4+從jQuery/ajax保存序列化的可排序數據

有個問題找出將ajax可排序列表保存到我的數據庫的最佳方法。我正在使用HTML5Sortable和Laravel 4.2框架。我試圖達到的基本最終結果是用戶能夠點擊並拖動列表項並對它們重新排序，並且這個新訂單將被保存在數據庫中名爲「order」的字段中，以便當它們返回時新訂單將在稍後的頁面出現。使用Laravel 4+從jQuery/ajax保存序列化的可排序數據

我有章節列表頁面上，像這樣：

<ul class="sortable"> 
    @foreach ($chapters as $chapter) 
     <li class="ui-state-default" data-order="{{ $chapter->order }}">{{ $chapter->title }}</li> 
    @endforeach 
</ul>

我可以拖放排序這些使用HTML5Sortable然後序列化這些數據，並通過AJAX的POST，它每次觸發關閉提交該列表重新排序，像這樣：

$('.sortable').sortable().bind('sortupdate', function(e, ui) { 

    var order = $('ul.sortable li').map(function(){ 
     return $(this).data("order"); 
    }).get(); 

    var uuid = "<?php echo$uuid; ?>"; 

    $.ajax({ 
     type: "POST", 
     url: "api-ch-order", 
     dataType: "json", 
     data: {order: order, uuid: uuid}, 
     success: function(order){ 
      console.log(order) 
     } 
    }); 
});

我控制器在/ API CH-爲了獲得數據並保存的新秩序，像這樣：

if(Request::ajax()){ 

    $uuid = Input::get('uuid'); 
    $order = Input::get('order'); 

    $i = 1; 

    foreach($order as $position) { 

    $chapter = Chapter::where('book_uuid', $uuid)->where('order', $position)->first(); 

    $chapter->order = $i; 
    $chapter->save(); 

    $i++; 

    } 

}

的問題

我用這種方法遇到的問題是，它不會在某些情況下工作，循環會導致問題。

例如

LOOP 1：FIND章其中順序= 2和變化，以1

LOOP 2：FIND章其中順序= 1，它更改爲2

這裏的問題是，在環2是找到LOOP 1的結果並更新它，而不是...我認爲...這個問題讓我感到困惑不少...但我99％確定我的控制器中的foreach循環是問題，我不確定解決這個問題的最佳方法。

資源鏈接到這個問題：

答案！

正如r4xz所提到的，答案是使用ID作爲常數。

E.g.

HTML

<ul class="sortable"> 
    @foreach ($chapters as $chapter) 
     <li class="ui-state-default" data-id="{{ $chapter->id }}">{{ $chapter->title }}</li> 
    @endforeach 
</ul>

$('.sortable').sortable().bind('sortupdate', function(e, ui) { 

    var id = $('ul.sortable li').map(function(){ 
     return $(this).data("id"); 
    }).get(); 

    var uuid = "<?php echo$uuid; ?>"; 

    $.ajax({ 
     type: "POST", 
     url: "api-ch-order", 
     dataType: "json", 
     data: {id: id, uuid: uuid}, 
     success: function(order){ 
      console.log(id) 
     } 
    }); 
});

PHP控制器

if(Request::ajax()){ 

    $uuid = Input::get('uuid'); 
    $id = Input::get('id'); 

    $i = 1; 

    foreach($id as $val) { 

    $chapter = Chapter::where('id', $val)->first(); 

    $chapter->order = $i; 
    $chapter->save(); 

    $i++; 

    } 

}

來源

2014-10-04 Josh

我愛你在這裏給出的例子。我終於得到了可排序的列表進行排序，但它似乎沒有發佈......我無法弄清楚發生了什麼。有什麼想法？ – MasterZ 2014-10-09 05:42:12

你可以在你的JS中使用$ .ajax（如上所述）並將它發佈到你的routes.php文件中的一個路由，例如Route :: post（'api-ch-order'，'SomeController @ SomeFunction'）;然後使用我上面的控制器。這應該工作... – Josh 2014-10-09 12:51:20

如果仍然沒有運氣後，然後張貼一個新的問題，並將其鏈接到我這裏，我會看看我是否可以幫助:) – Josh 2014-10-09 12:55:22

最常見的解決方法是保存位置和實體ID：

<li data-id="{{ $chapter->id }}" data-order="{{ $chapter->order }}">{{ $chapter->title }}</li>

然後在控制器只需使用：

UPDATE chapter SET order = $order WHERE id = $id

來源

2014-10-04 07:43:10

完美。這正是我最終的目標！將發佈完整答案作爲我的問題的編輯。 – Josh 2014-10-04 12:05:09

這個問題是非常有益的，並給出了selfanswer進去！太棒了！謝謝！

只爲那些在我的情況下不使用相同的結構。這是我做過什麼：

public function myRouteFunction(Request $request) 
    foreach($ids as $key => $id) { 
     $update = DB::table('mybase')->where('id', $id)->update(['sort_order' => $key]); 
    } 
}

也許這可以幫助別人:)

來源

2017-02-09 15:19:04 Jicao

使用Laravel 4+從jQuery/ajax保存序列化的可排序數據

回答

相關問題