类别联动下拉菜单

适用范围：省市无限级联动，商品类别无限极联动

需要使用到的jQuery插件为cxselect，ok说不清楚，还是直接上代码比较直观

HTML代码如下：

<div id="element_id" class="formControls col-xs-8 col-sm-9">
      <select class="select1" id="cate" name="category[]" data-value="" data-first-title="----全部----" style="height:30px;"></select> 
      <select class="select2" id="cate" name="category[]" data-value="" data-first-title="----全部----" style="height:30px;"></select> 
      <select class="select3" id="cate" name="category[]" data-value="" data-first-title="----全部----" style="height:30px;"></select>
      <select class="select4" id="cate" name="category[]" data-value="" data-first-title="----全部----" style="height:30px;"></select>
      <select class="select5" id="cate" name="category[]" data-value="" data-first-title="----全部----" style="height:30px;"></select> 
</div>

js代码如下：

 1 <script type="text/javascript" src="__STATIC__/admin/js/cxselect/jquery.cxselect.min.js"></script>
 2 
 3 function checkForm(){
 4     var categorys = [];
 5     $("#cate").each(function () {
 6         var val = $(this).val();
 7         if (val != "") {
 8             categorys.push(val);
 9         }
10     });
11     if (categorys.length == 0) {
12         alert("请选择类别。");
13         return false;
14     }
15     return true;
16 }
17 
18 $.cxSelect.defaults.url = \'/category/category.json\';
19 $(\'#element_id\').cxSelect({
20     selects: [\'select1\', \'select2\', \'select3\', \'select4\', \'select5\'],
21     nodata: \'none\',
22     required:false,
23     firstTitle:\'----全部----\',
24     firstValue:\'\'
25 });

category.json文件需要在类别管理中生成所有类别的json文件，php控制器代码如下：

1     /*生成类别json数据*/
2     public function createJson(){
3         $categoryModel = new CateModel();
4         if($categoryModel->wirteJson()){
5             echo "<script>alert(\'类别数据生成成功!\');location.href=\'index\';</script>";
6         }else{
7             echo "<script>alert(\'类别数据生成失败!\');location.href=\'index\';</script>";
8         }
9     }

php模型代码如下：

 1 /*生成类别JSON数据*/
 2 public function wirteJson(){
 3     $dataInfo = \think\Db::query("select id as v,name as n,pid from think_pro_category");
 4     $data = $this->getCategoryJson($dataInfo);
 5     return $data;
 6 }
 7 
 8 /**
 9  * 功能:无限级类别json数据生成
10  * 参数:$data 类别查询结果集
11  * 返回值:$json 递归查询排序后的json数据
12  */
13 public function getCategoryJson($dataInfo) {
14     /*生成json数据*/
15     foreach($dataInfo as $category) {
16         $tree[$category[\'v\']] = $category;
17         $tree[$category[\'v\']][\'s\'] = array();
18     }
19     $content = json_encode(generateTree($tree));
20     $content = str_replace(\',"s":[]\', "", $content);
21     // for( $i = 0; $i < count($dataInfo); $i++ ) {
22     //     $content = str_replace(\'"\'.$dataInfo[$i][\'v\'].\'":\', "", $content);
23     // }
24     //$content = \'[\'.substr($content,1,strlen($content)-2).\']\';
25     //return $content;
26     /*写入文件*/
27     //文件存放路径
28     $filePath = $_SERVER[\'DOCUMENT_ROOT\'].DS.\'/category/category.json\';
29     $returnval = file_put_contents($filePath,$content);
30     // $fopen = fopen($filePath,\'w+\');
31     // fwrite($fopen,$content);
32     // fclose($fopen);
33     return $returnval;
34 }

公共函数：

 1 /**
 2  *处理分类数组
 3 **/
 4 function generateTree($items) {
 5     $tree = array();
 6     foreach($items as $item){
 7         if(isset($items[$item[\'pid\']])){
 8             $items[$item[\'pid\']][\'s\'][] = &$items[$item[\'v\']];
 9         }else{
10             $tree[] = &$items[$item[\'v\']];
11         }
12     }
13     return $tree;
14 }