Сегодня мы напишем примочку к плагину на jQuery — simple tree plugin. Этот плагин выводит список в виде дерева, и позволяет перемещать элементы этого дерева. И так создаем таблицу myqsl:

CREATE TABLE `category` (
  `category_id` int(11) NOT NULL AUTO_INCREMENT,
  `parent_id` int(11) DEFAULT '0',
  `category_label` varchar(100) DEFAULT NULL,
  `orderby` int(11) DEFAULT NULL,
  PRIMARY KEY  (`category_id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

Для теста вставляем записи:

INSERT INTO `category` (`category_id`,`parent_id`,`category_label`,`orderby`) VALUES ('1','0','category one','1');
INSERT INTO `category` (`category_id`,`parent_id`,`category_label`,`orderby`) VALUES ('2','0','category two','2');
INSERT INTO `category` (`category_id`,`parent_id`,`category_label`,`orderby`) VALUES ('3','2','category three','1');
INSERT INTO `category` (`category_id`,`parent_id`,`category_label`,`orderby`) VALUES ('4','2','category four','2');
INSERT INTO `category` (`category_id`,`parent_id`,`category_label`,`orderby`) VALUES ('5','4','category fine','1');
INSERT INTO `category` (`category_id`,`parent_id`,`category_label`,`orderby`) VALUES ('6','0','category six','3');
INSERT INTO `category` (`category_id`,`parent_id`,`category_label`,`orderby`) VALUES ('7','6','category seven','1');

Должны получить структуру следующего вида:

<ul class="simpleTree">
 <li id="0" class="root"><span>Categories</span>
  <ul>
   <li id="1"><span>Category one</li>
   <li id="2"><span>Category two</span>
    <ul>
     <li id="3"><span>Category three</span></li>
     <li id="4"><span>Category four</span>
      <ul>
       <li id="5"><span>Category five</span></li>
      </ul>
    </li>
   </ul>
   <li id="6"><span>Category six</span>
    <ul>
     <li id="7"><span>Category seven</span></li>
    </ul>
   </li>
  </ul>
 </li>
</ul>

И так приступаем к кодированию

mysql_connect("<b>host</b>", "<b>user</b>", "<b>password</b>") or die(mysql_error());
mysql_select_db("<b>database</b>") or die(mysql_error());

$rsCategories = mysql_query("SELECT * FROM category ORDER BY parent_id, orderby");

$arrayCategories = array();

while($row = mysql_fetch_assoc($rsCategories)){
	$arrayCategories[$row['category_id']] = array("parent_id" => $row['parent_id'], "name" => $row['category_label']);
}

Затем пишем функции, которые будут строить структуру, нужную нам

function createTreeT($array, $currentParent, $currLevel = -1) {
	foreach ($array as $categoryId => $category) {
		if ($currentParent == $category['parent_id']) {

			for ($i=0;$i<$currLevel;$i++) echo "*";			

			echo $category['name']."<br />";

			$currLevel++;
		 	createTreeT ($array, $categoryId, $currLevel);
		 	$currLevel--;
		}
	}
}

function createTree($array, $currentParent, $currLevel = 0, $prevLevel = -1) {

	foreach ($array as $categoryId => $category) {

		if ($currentParent == $category['parent_id']) {						

			if ($currLevel > $prevLevel) echo " <ul> "; 

			if ($currLevel == $prevLevel) echo " </li> ";

			echo '<li id="'.$categoryId.'"><span>'.$category['name'].'</span>';

			if ($currLevel > $prevLevel) { $prevLevel = $currLevel; }

			$currLevel++; 

		 	createTree ($array, $categoryId, $currLevel, $prevLevel);

		 	$currLevel--;
		}	

	}

	if ($currLevel == $prevLevel) echo " </li>  </ul> ";

}

<ul class="simpleTree">
	<li id="0" class="root"><span>Categories</span>
		<?php createTree($arrayCategories, 0); ?>
	</li>
</ul>

Следующая функция передает файлу saveData.php сереализованный массив данных, вида 0:1:1|0:2:2|2:3:1|2:5:2|2:4:3|0:6:3|6:7:1|

function(){
	var serialStr = "";
	var order = "";

	$("ul.simpleTree li span").each(function(){
		parentId = $(this).parent("li").parent("ul").parent("li").attr("id");
		if (parentId == undefined) parentId = "root";
		order = (($(this).parent("li").prevAll("li").size()+1))/2;
		if ( parentId != "root") serialStr += ""+parentId+":"+$(this).parent("li").attr("id")+":"+order+"|";
	});

	$.ajax({
	   type: "POST",
	   url: "saveData.php",
	   data: "serialized="+serialStr,
	   success: function(msg){
	   	 $("#serializedList").html(msg);
	   }
	 });

	return false;

}

А вот и сам файл saveData.php.

include_once("connection.php"); // the connection to the database
if ($_POST['serialized']) {

	$categories = explode("|", substr($_POST['serialized'],0,-1));
	$error =  false;

	foreach ($categories as $category) {
 		list($parentId, $categoryId, $order) = split(":", $category);

 		$result = mysql_query("UPDATE category SET parent_id = ".$parentId.", orderby = ".$order."
 						    WHERE category_id = ".$categoryId ) or die(mysql_error());

 	}	

	echo "Tree updated.";

}
echo "<br />".$_POST['serialized'];

Скачать пример