Pocket
LINEで送る

参考:http://api.jqueryui.com/sortable/#method-serialize

ここで、item_1、item_2といった感じで連番ふるよといいましたが、どちらかというと並び替えの場合、並び替え対象でDBのIDで管理しないといけないと思いますので、item_idという感じにした方がよかったです。

cakePHPだと、下記のような感じにするといいのではないでしょうか。

item_<?php echo h($item['Item']['id'])?>

$(this).sortable(‘serialize’);で下記のようなデータが得られます。

item[]=2&item[]=1

2と1がIDであれば、これをそのままAjaxでsortアクションなんかに渡します。
以下は例です。

function save_sort(sort_data){
	$.ajax({
		type:'post',
		url: '<?php echo $this->Html->url(array( 'controller' => 'hogehoge', 'action' => 'sort'))?>',
		data: sort_data,
		dataType: 'html',
		async: true,
		success: function(data){
			alert('sort ok!');
		}
	});
}

$(function(){
	$('#sortable').sortable({
		cursor: 'move',
		opacity: 0.7,
		placeholder: "placeholder",
		forcePlaceholderSize: true,
		cancel:false,
		handle:'.move_btn',
		update: function(event, ui){
			save_sort($(this).sortable('serialize'));
		}
	});
});

これでhogehogeコントローラーのsortアクションにアクセスしてくれて、$this->request->dataの中にソートデータが下記のように入っております。Formのシリアライズと一緒です。便利です。

スクリーンショット 2014-06-25 0.49.26

Pocket
LINEで送る

カテゴリー: プログラミング

1件のコメント

安川裕三 · 09/29/2015 01:45

いつも拝見させていただいております。
わかりやすく知見を公開してくださってありがとうございます。

この通りにやってみたのですが、どうもうまくいきません。cakephpで実行したいのですが、サンプルファイルか何かを挙げていただけないでしょうか。お時間がありましたら、どうかよろしくお願い致します。よろしくお願いします。

コメントください

関連記事

プログラミング

cakePHP2 – 多言語化

多言語化します。 cakephpマニュアルのこのページに説明が書いてあ 続きを読む …

プログラミング

Go言語によるビットコインのフルノード実装btcdを調べる(2)

btcdを実行した際のプログラムの流れを最初から確認してみます。 se 続きを読む …

%d人のブロガーが「いいね」をつけました。