thinkphp implementation of infinite Classification (using recursion) _javascript techniques

The example of this article for you to share the thinkphp implementation of the infinite classification of the detailed code, I hope that you learn the infinite classification of inspiration.

Database: Test
Datasheet: (tp_category):

common/conf/config.php

' Db_config2 ' => array (
 ' db_type ' => ' mysql ',
 ' Db_user ' => ' root ',
 ' db_pwd
 ' => '), ' db_ Host ' => ' localhost ',
 ' db_port ' => ' 3306 ',
 ' db_name ' => ' test ',
 ' db_prefix ' => ' tp_ ',//database table prefix c9/> ' db_charset ' => ' UTF8 ',//Character set
 ' Db_debug ' => TRUE,///Database debug mode opens to log SQL Log 3.2.3 Add
),

common/function.php traversal function loop

*
 * Recursive traversal
 * @param $data Array
 * @param $id int
 * Return array * *
/function recursion ($data, $id = 0) {
 $list = array ();
 foreach ($data as $v) {
 if ($v [' pid '] = = $id) {
 $v [' son '] = recursion ($data, $v [' id ']);
 if (Empty ($v [' son '])) {
 unset ($v [' son ']);
 }
 Array_push ($list, $v);
 }
 return $list;
}

controller/indexcontroller.class.php

The Public Function test () {
 $category = M (' category ', ', ', C (' Db_config2 '))->select ();
 $result = Loop ($category);
 Var_dump ($result);
 $this->assign (' list ', $result);
 $this->display ();
}

In the template (view/index/test.html) output (only support Level 2 classification, if you want to show all, we recommend that the array into JSON format, and then through the AJAX request, JS Generation)

<ul>
 <volist name= "list" id= "Vo" >
 <li>
 {$vo. Category}
 <notempty name= "vo[" Children '] ">
 <ul>
  <volist name=" vo[' children '] "id=" Cate ">
  <li>{$cate. Category} </li>
  </volist>
 </ul>
 </notempty>
 </li>
 </volist>
</ul>

Follow Up (Ajax request, recursively show all categories):

Method controller/indexcontroller.class.php

Public Function test () {
 $this->display ();
}

Public Function Resultcategory () {
 $category = M (' category ', ', ', C (' Db_config2 '))->select ();
 $result = Loop ($category);
 $this->ajaxreturn (Array (' Data ' => $result, ' status ' => ' 1 ', ' info ' => ' get list success ')
}

Template view/index/test.html

 <! DOCTYPE html>  
 

Another type of infinite class:

/**
 * Infinite Polar Classification
 * @param [Type] $cate [description]
 * @param integer $pid [description]
 * @param integer $leve l [description]
 * @param string $html [description]
 * @return [Type] [description]
/function Sortout ( $cate, $pid =0, $level =0, $html = '--') {
 $tree = array ();
 foreach ($cate as $v) {
 if ($v [' pid '] = = $pid) {
 $v [' level '] = $level + 1;
 $v [' html '] = Str_repeat ($html, $level);
 $tree [] = $v;
 $tree = Array_merge ($tree, Sortout ($cate, $v [' id '], $level +1, $html));
 }
 return $tree;
}

JS Recursive (Special):

This function is equivalent to implementing PHP's Str_repeat function

/* String Repeat function *
/if (! String.str_out_times) {
 String.prototype.str_out_times = function (l) {return
 new Array (l+1). Join (this);
}

Navigate to the current selection
function recursion (selector, data, J, PID) {
 var space = ' ┠ ';
 if (!data) return false;
 $.each (data, function (I, item) {
 var opt = $ (' <option value= "' +item.id+ '" > ' +space.str_out_times (j) + item.name+ ' </option> '); Selector.append (opt);
 if (Item.son && (Item.son). length>0) {
 recursion (selector, Item.son, ++j);
 j=0; 
 }
 });

 Which category is currently
 selector.find (' option '). each (function () {
 if ($ (this). val () = pid) {
 $ (this). attr (' Selected ', ' selected ');
 }

Why J=0? Because the execution order feels different from PHP, this is loaded from top to bottom.

Ajax Request Data:

$ ('. Btn-edit '). Click (function () {
 var id = $ (this). Data (' id ');
 $.post ("{: U (' article/editarticle ')}", {Id:id}, function (res) {

 //category
 $ (' [name= ' pid '] '). html (');
 Recursion ($ (' [name= ' pid] '), Res.sort, 0, res.pid);

 $ (' [name= ' id] '). Val (res.id);
 $ (' [name= ' title '] '). Val (res.title);
 $ (' [name= ' summary] '). Val (res.summary);
 $ (' #thumbnailImg '). attr (' src ', "__upload__" + '/thumbnail/' +res.thumbnail);
 Ue.setcontent (res.content);

 $ (' #modal-edit '). Modal (' show ');
 };
});

The above is thinkphp realize infinite classification method, hope to be helpful to everybody's study.