rakuishi · January 17, 2015 00:16
diff --git a/sortable.php b/sortable.php
 <?php

 // データベース接続
 mysql_connect('localhost', 'root', 'root');
 mysql_select_db('database');
 mysql_query('SET NAMES UTF8');

 // テーブルが存在しない場合は作成する
 if (mysql_query('SELECT 1 FROM kurage') == FALSE) {
 	$sql = "CREATE TABLE kurage (id INT UNSIGNED AUTO_INCREMENT PRIMARY KEY, name TEXT, sort INT UNSIGNED)";
 	mysql_query($sql);

 	// 初期データを登録する
 	$kurages = array("プラヌラ", "ポリプ", "ストロビラ", "エフィラ", "稚クラゲ", "成体");
 	for ($i = 0; $i < count($kurages); $i++) {
 		$sql = "INSERT INTO kurage SET name = '{$kurages[$i]}', sort = '{$i}'";
 		mysql_query($sql);
 	}	
 }

 // 並び順が POST に格納されている場合は、並び順を変える
 $result = $_POST['result'];
 if ($result != NULL) {
 	// データの id が「,」区切りで順番に格納されているデータを配列に変換する
 	$ids = explode(",", $result);
 	for ($i = 0; $i < count($ids); $i++) {
 		$id = $ids[$i] + 0;
 		$sql = "UPDATE kurage SET sort='{$i}' WHERE id='{$id}'";
 		mysql_query($sql);
 	}
 }

 // ソート順にデータを取得する
 $sql = "SELECT * FROM kurage ORDER BY sort";
 $recordSet = mysql_query($sql);
 while ($data = mysql_fetch_assoc($recordSet)) {
 	$id = $data['id'];
 	$name = $data['name'];
 	$list .= "<li id=\"{$id}\">{$name}</li>";
 }

 ?>
 <!DOCTYPE>
 <html lang="ja">
 <head>
 <meta charset="utf-8" />
 <script src="js/jquery-1.9.1.js"></script>
 <script src="js/jquery-ui-1.10.3.custom.js"></script>
 </head>
 <body>

 <h1 style="font-size: 18px">ミズクラゲの生活環</h1>

 <ul id="sortable"><?php echo $list; ?></ul>

 <form action="" method="post">
 	<input type="hidden" id="result" name="result" />
 	<input type="submit" id="submit" value="並び順を保存する" />
 </form>

 <script>
 $(function() {
 	// ソート可能にする
 	$("#sortable").sortable();
 	$("#submit").click(function() {
 		// result に並び順を格納する
 		var result = $("#sortable").sortable("toArray");
 		$("#result").val(result);
 		$("form").submit();
 	});
 });
 </script>

 </body>
 </html>
	<?php

	// データベース接続
	mysql_connect('localhost', 'root', 'root');
	mysql_select_db('database');
	mysql_query('SET NAMES UTF8');

	// テーブルが存在しない場合は作成する
	if (mysql_query('SELECT 1 FROM kurage') == FALSE) {
	$sql = "CREATE TABLE kurage (id INT UNSIGNED AUTO_INCREMENT PRIMARY KEY, name TEXT, sort INT UNSIGNED)";
	mysql_query($sql);

	// 初期データを登録する
	$kurages = array("プラヌラ", "ポリプ", "ストロビラ", "エフィラ", "稚クラゲ", "成体");
	for ($i = 0; $i < count($kurages); $i++) {
	$sql = "INSERT INTO kurage SET name = '{$kurages[$i]}', sort = '{$i}'";
	mysql_query($sql);
	}
	}

	// 並び順が POST に格納されている場合は、並び順を変える
	$result = $_POST['result'];
	if ($result != NULL) {
	// データの id が「,」区切りで順番に格納されているデータを配列に変換する
	$ids = explode(",", $result);
	for ($i = 0; $i < count($ids); $i++) {
	$id = $ids[$i] + 0;
	$sql = "UPDATE kurage SET sort='{$i}' WHERE id='{$id}'";
	mysql_query($sql);
	}
	}

	// ソート順にデータを取得する
	$sql = "SELECT * FROM kurage ORDER BY sort";
	$recordSet = mysql_query($sql);
	while ($data = mysql_fetch_assoc($recordSet)) {
	$id = $data['id'];
	$name = $data['name'];
	$list .= "<li id=\"{$id}\">{$name}</li>";
	}

	?>
	<!DOCTYPE>
	<html lang="ja">
	<head>
	<meta charset="utf-8" />
	<script src="js/jquery-1.9.1.js"></script>
	<script src="js/jquery-ui-1.10.3.custom.js"></script>
	</head>
	<body>

	<h1 style="font-size: 18px">ミズクラゲの生活環</h1>

	<ul id="sortable"><?php echo $list; ?></ul>

	<form action="" method="post">
	<input type="hidden" id="result" name="result" />
	<input type="submit" id="submit" value="並び順を保存する" />
	</form>

	<script>
	$(function() {
	// ソート可能にする
	$("#sortable").sortable();
	$("#submit").click(function() {
	// result に並び順を格納する
	var result = $("#sortable").sortable("toArray");
	$("#result").val(result);
	$("form").submit();
	});
	});
	</script>

	</body>
	</html>