jeesite级联下拉框
1. 首先，搞本字典，在系统设置->字典管理里新增一部字典，并添加数据
前两位是一级分类，再两位是二级分类，最后三位是最后一级分类
2. 在需要下拉框的html文件内，找到下拉框对应标签然后在<script>标签中添加以下js代码，用标签后的内容替换#后面的字符串
1 var assetSortJson; 2 $.ajax({ 3 type:"POST", 4 url:"${ctx}/sys/dictData/treeData?dictType=asset_sort", 5 dataType:"json", 6 success: function(json){ 7 8 assetSortJson = json 9 10 // 当前选择的class编号 11 var cla = $('#assetClassId option:selected').val(); 12 // 指向options所在标签 13 var classSelect = $("#assetClassId")[0]; 14 // 清空所有selection，在for循环中重新导入相应的class 15 classSelect.options.length=1; 16 17 var sort = $('#assetSortId option:selected').val(); 18 var sortSelect = $("#assetSortId")[0]; 19 sortSelect.options.length=1; 20 21 22 var category = $('#categoryId option:selected').val(); 23 var categorySelect = $("#categoryId")[0]; 24 categorySelect.options.length=1; 25 26 for (var i of assetSortJson) { 27 if (i.value.length == 2) { 28 classSelect.options.add(new Option(i.name, i.value, false, i.value == cla)); 29 } else if (i.value.length == 4 && i.value.substr(0, 2) == cla) { 30 sortSelect.options.add(new Option(i.name, i.value, false, i.value == sort)); 31 } else if (i.value.length == 7 && i.value.substr(0, 4) == sort) { 32 categorySelect.options.add(new Option(i.name, i.value, false, i.value == category)); 33 } 34 } 35 } 36 });
这里的assetsort会从字典的路由中把整本字典以json格式取出来，之后别有他用。
我的分类有三级，分别取名class, sort, category。根据不同的长度，依次将不同级别的选项加入到xxxSelect中。
现在我们再次打开页面，初始化后，选项已经不再是整本字典了，而是我们分类之后的结果。
3. 然后再次找到那几个标签，加上onchange=<方法名>，然后在<script>标签中再次添加如下代码
1 function getSort() { 2 var selectedClass = $('#assetClassId option:selected').val(); 3 4 var selectedSort = $('#assetSortId option:selected').val(); 5 var sortSelect = $("#assetSortId")[0]; 6 sortSelect.options.length=1; 7 8 var categorySelect = $("#categoryId")[0]; 9 categorySelect.options.length=1; 10 11 for (var i of assetSortJson) { 12 if (i.value.length == 4 && i.value.substr(0, 2) == selectedClass) { 13 sortSelect.options.add(new Option(i.name, i.value, false, i.value == selectedSort)); 14 } 15 } 16 } 17 18 function getCategory() { 19 var selectedSort = $('#assetSortId option:selected').val(); 20 21 var isSelected = $('#categoryId option:selected').val(); 22 var categorySelect = $("#categoryId")[0]; 23 categorySelect.options.length=1; 24 25 for (var i of assetSortJson) { 26 if (i.value.length == 7 && i.value.substr(0, 4) == selectedSort) { 27 categorySelect.options.add(new Option(i.name, i.value, false, i.value == isSelected)); 28 } 29 } 30 }
这里我们就要用到刚才取出的json，然后再根据该分类的长度，把选项重新放入。其实可以用filter的功能，多存几个变量，这样就不用每次扫整个json了。
4.
这里呢就是效果图了，成了！
