layui动态渲染生成select的option值

复制代码

复制代码
 1     
脚本语言:设定默认值;直接拼接,然后根据返回值渲染select
// 动态渲染脚本类型下拉框 2 // 1.发送ajax请求得到data 3 // 2.将data渲染到页面上 4 function getDataList() { 5 // 请求 6 $.ajax({ 7 type:'post', 8 url: "/cd/workPlatform/tool/detail", 9 success:function(response){ 10 var data=response.data; 11 $('#scriptLanguage').empty(); 12 var t; 13 if(data==null){ 14 t='<option value="1" selected="selected">shell</option><option value="0" >damao</option><option value="2">bobo/option>' 15 }else if(data.scriptLanguage=='1'){ 16 t='<option value="1" selected="selected">bobo</option><option value="0" >damao</option><option value="2">bobo/option>' 17 18 }else if(data.scriptLanguage=='2'){ 19 t='<option value="1" selected="selected">xiaoyang</option><option value="0" >damao</option><option value="2">bobo</option>' 20 21 }; 22 $('.scriptLanguage').append(t); 23 form.render('select'); 24 } 25 }) 26 } 27 28 $(document).ready(function () { 29 getDataList(); 30 });
复制代码

 

 1 //展示下拉框
 2     function showCategory(data, count) {
 3         $(data).each(function (i, n) {
 4           //  console.log(n);
 5             var t = "";
 6             for (var j = 0; j < count; ++j) {
 7                 t += "&nbsp;&nbsp;&nbsp";
 8             }
 9             if (n.children.length > 0) {
10                 $("#toolType").append("<option value='" + n.id + "' style='font-weight: bold;'>" + t + n.categoryName + "</option>");
11                 showCategory(n.children, count + 1)
12             } else {
13                 $("#toolType").append("<option value='" + n.id + "'>" + t + n.categoryName + "</option>");
14             }
15         });
16         form.render('select');
17     }
18     $("#toolType").append("<option value=''>请选择脚本类型</option>");
19     $.get("/cd/tool/category/tree.afca", {}, function (data) {
20         showCategory(data.data, 0);
21         form.render('select');
22     }, "json");
复制代码

 

posted @   前端极客  阅读(66263)  评论(2编辑  收藏  举报
编辑推荐:
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
阅读排行:
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 字符编码:从基础到乱码解决
点击右上角即可分享
微信分享提示