精华内容
下载资源
问答
  • layui 下拉表插件--改动
    2019-02-22 18:01:45

    原网址 ,tableSelect下拉表

    最新的完善:主要当表格超出文档,会定位不准,改动源码部位在最后面,前面的 点搜索有问题!!!

    改动及完善:

    • 结构
      <link rel="stylesheet" href="../../../layuiadmin/layui/css/layui.css" media="all">
    
      <style>
        .layui-form-label {
          width: 90px;
        }
      </style>
        
     <div class="layui-form-item">
                <div class="layui-inline">
                  <label class="layui-form-label">客户名称<i style="color:red;">*</i></label>
                  <div class="layui-input-inline" style="position:relative ;">
                    <input type="text" id="customerId" name="projectCustomerId" lay-verify="required" autocomplete="off" placeholder="搜索..."
                           class="layui-input"/>
    
                  </div>
                </div>
                <div class="layui-inline">
                  <label class="layui-form-label">客户电话</label>
                  <div class="layui-input-inline">
                    <input type="text" id="customerTel" placeholder="" autocomplete="off" class="layui-input">
                  </div>
                </div>
              </div>
    • js代码
     layui.config({
        base: '../../../layuiadmin/' //静态资源所在路径
      }).extend({
        tableSelect: 'lib/tableSelect' //主入口模块
      }).use([ 'form', 'laydate','tableSelect'], function () {
        var $ = layui.jquery
          , form = layui.form
          , laydate = layui.laydate
          , tableSelect = layui.tableSelect ;
          console.log(tableSelect)
        lay('.lay-input-date').each(function () {
          laydate.render({
            elem: this,
            format: 'yyyy-MM-dd',
            type: 'date',
            trigger: 'click'
          })
        })
    
        //===============下拉树 渲染===========
        tableSelect.render({
          elem: '#customerId',         //所操作的元素
          searchKey: 'customerName',   //搜索输入框的 搜索所条件name
          searchPlaceholder: '名字筛选...', // 搜索框中的提示信息
          checkedKey: 'customerName',  // 利用复选框时的name
          table: {
            url: '/project/customer',  //数据的地址
            limit:5,   //返回限制条数
            width:350,    //表格宽度
            cols: [[
              { type: 'radio' },
              { field: 'customerId', title: '序号' },
              { field: 'customerName', title: '姓名' },
            ]]
          },
          done: function (elem, data) {
            console.log(JSON.stringify(data))
            var NEWJSON = []
            layui.each(data.data, function (index, item) {
              NEWJSON.push(item.customerName)  //双击时的name
            })
            elem.val(NEWJSON.join(","))
    
          //  由用户id查客户详细信息 type仅为 radio时 调用客户信息!!!!
           var customerId = data.data[0].customerId;
            getCustomerInfo(customerId);
          }
        });
    
        //=============由用户id查客户详细信息=============
        function getCustomerInfo(customerId){
            $.ajax({
              url: '/project/customer/' + customerId,
              type: "get",
              contentType: "application/json", //设置请求参数类型为json字符串
              dataType: "json",
              success: function (res) {
                console.log(res.status)
                if (res.status == 200) {
                  layer.msg("查询成功", {
                    icon: 6
                  });
    
                // ==这里写渲染客户信息的函数==
                  var data = res.data;
                  //赋值客户信息
                  setCustomerInfo(data)
    
                } else {
                  layer.msg(res.msg, {
                    icon: 5
                  });
                }
              }
            })
        }
    
        // //==渲染客户信息==
        function setCustomerInfo(data){
          var customerAddress = data.customerAddress  //地址
            ,customerDepositBank =data.customerDepositBank  //开户行
            ,customerInvoiceTitle = data.customerInvoiceTitle   //开票抬头
            ,customerTel =data.customerTel   //客户电话
            ,customerTaxid = data.customerTaxid // 税号
    
            ,contacts = data.contacts  //联系电话数组
    
    
    
        }
    
        form.on('submit(component-form-element)', function (data) {
          layer.msg(JSON.stringify(data.field));
          var index = parent.layer.getFrameIndex(window.name); /* 先得到当前iframe层的索引 */
          parent.layer.close(index); //再执行关闭
          return false;
        });
      });

    改动的源代码

     

     


    •   //FIX位置
            var overHeight = (elem.offset().top + elem.outerHeight() + tableBox.outerHeight() - $(window).scrollTop()) > $(window).height();
            var overWidth = (elem.offset().left + tableBox.outerWidth()) > $(window).width();
            // overHeight && tableBox.css({'top':'auto','bottom':'0px'});
            overHeight && tableBox.css({'top':t,'left':l});  //直接还是赋值 上面的死值!!!
            overWidth && tableBox.css({'left':'auto','right':'5px'})

       

    更多相关内容
  • layui table 表格渲染渲染表格用的layui.table.render,其中修改数据,删除数据由于本人刚刚开始用layui,部分方法不太熟练,用的ajax html 部分 <div class="layui-fluid"> <div class="layui-row ...

    layui table 表格渲染,渲染表格用的layui.table.render,其中修改数据,删除数据由于本人刚刚开始用layui,部分方法不太熟练,用的ajax
    html 部分

    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
          <div class="layui-col-md12">
            <div class="layui-card">
              <div class="layui-card-body">
                <div class="xsj_btn" style="margin-bottom: 10px;"><button class="layui-btn layui-btn-normal" id="btnAddAuth">添加</button></div>
                <table class="layui-hide" id="test-table-toolbar" lay-filter="test-table-toolbar"></table>
    
                <script type="text/html" id="test-table-toolbar-barDemo">
                  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                </script>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- 表单弹窗 -->
      <div type="text/html" id="modelAuth" style="display: none;">
        <form id="modelAuthForm" lay-filter="modelAuthForm" class="layui-form model-form" style="padding: 25px 30px 0 0;">
            <input name="authorityId" type="hidden"/>
            <div class="layui-form-item">
                <label class="layui-form-label">appid</label>
                <div class="layui-input-block">
                    <input name="appid" placeholder="请输入appid" type="text" class="layui-input" maxlength="50"
                           lay-verType="tips" lay-verify="required" required/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密钥</label>
                <div class="layui-input-block">
                    <input name="secret" placeholder="请输入密钥" type="text" class="layui-input" maxlength="50"
                           lay-verType="tips" lay-verify="required" required/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">签名名称</label>
                <div class="layui-input-block">
                    <input name="sign" placeholder="请输入签名" type="text" class="layui-input"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">短信模板</label>
                <div class="layui-input-block">
                    <input name="template" placeholder="请输入模板" type="text" class="layui-input"/>
                </div>
            </div>
            <div class="layui-form-item text-right layui-layer-btn layui-layer-btn-">
                <button class="layui-btn" lay-filter="modelSubmitAuth" lay-submit style="height: 28px;
                line-height: 28px;
                margin: 5px 5px 0;
                padding: 0 15px;
                border-color: #1E9FFF;
    background-color: #1E9FFF;
    color: #fff;
                border-radius: 2px;font-weight: 400;cursor: pointer;">保存</button>
                <a class="">取消</a>
            </div>
        </form>
        </div>
    

    js部分

    <script src="../../layuiadmin/layui/layui.js"></script> //引入layui
    <script>
      layui.config({
        base: '../../layuiadmin/' //静态资源所在路径
      }).extend({
        index: 'lib/index' //主入口模块
      }).use(['index', 'table','form','admin','user'], function(){
        var admin = layui.admin
        ,$ = layui.jquery
        ,form = layui.form
        ,table = layui.table;
        var key = localStorage.getItem('session_key');
        table.render({
          elem: '#test-table-toolbar'
          ,method: 'POST'
        //   ,contentType:'application/json'
          ,where: {'session_key': key,id: 0,flag:9}//添加其他参数
          ,request: {
            pageName: 'page',
            limitName: 'num' //每页数据量的参数名,默认:limit
          }
          ,url: layui.demo.interfaceUrl + '/sms/Sms/query_sms'//请求接口
          ,limit: 16//每页条数
          ,toolbar: false 
          ,cols: [[
            {field:'id', title:'ID',  fixed: 'left', unresize: true, sort: true}
            ,{field:'appid', title:'appid'}
            ,{field:'sign', title:'签名'}
            ,{field:'template', title:'模板'}
            ,{fixed: 'right', title:'操作', toolbar: '#test-table-toolbar-barDemo', width:350}
          ]]
          ,page: {layout: ['prev','page','next','count','skip']}//分页样式控制
          ,parseData: function(res){ //res 即为原始返回的数据
          return {
            "code": res.status, //解析接口状态
            "msg": res.msg, //解析提示文本
            "count": res.data.total, //解析数据长度
            "data": res.data.data //解析数据列表
          };
        }
        ,response: {
            statusCode: 200//请求状态码可更改
        },
        done: function(res, curr, count) {//请求完成后的操作
            console.log(res)
            // 其他情况提示
            if(res.status == 10010){
              layer.msg('您的账号已被迫下线,请重新登录', {// 过期登录
                offset: 'auto'
                ,icon: 1
                ,time: 2000
              }, function(){
                location.href = 'user/login.html'; //后台主页
              });
            }else if(res.code != 200){
              layer.msg(res.msg, {
              offset: '15px'
              ,icon: 1
              ,time: 2000
            }, function(){
              location.href = 'user/login.html'; //后台主页
            });
            }
        }
    
        });
        // 添加按钮点击事件
        $('#btnAddAuth').click(function () {
            var mauth = '添加';
            var datas = [];
            showEditModel(mauth,datas);
        });
        // 工具条点击事件
        table.on('tool(test-table-toolbar)', function(obj) {
                var data = obj.data;
                var layEvent = obj.event;
                if (layEvent === 'edit') { // 修改
                    var mauth = '修改';
                    showEditModel(mauth,data);
                } else if (layEvent === 'del') { // 删除
                    doDel(data.id);
                }
            });
        // 删除
        function doDel(id) {
            layer.confirm('确定要删除该短信配置吗?', {
                skin: 'layui-layer-admin',
                shade: .1
            }, function (index) {
                layer.close(index);
                layer.load(2);
                $.ajax({
                        url: layui.demo.interfaceUrl + '/sms/Sms/delete_sms' 
                        ,data: {
                        session_key: localStorage.getItem('session_key'),
                        id: id,
                        }
                        ,type: 'POST'
                        ,success:function(res){
                        if(res.status == 1){
                            layer.msg(res.msg, {
                            offset: 'auto'
                            ,icon: 1
                            ,time: 1000
                        }, function(){
                            location.reload(true);
                            layer.closeAll('loading');
                            layer.close(dIndex);
                        });
                        }else if(res.status == 10010){
                            layer.msg('您的账号已被迫下线,请重新登录', {//过期登录
                            offset: 'auto'
                            ,icon: 1
                            ,time: 2000
                            }, function(){
                            location.href = 'user/login.html'; //后台主页
                            });
                        }else{
                            layer.closeAll('loading');
                            layer.msg(res.msg); 
                        }
                        },
                        fail:function(){
                        layer.msg('网络异常', {
                            offset: 'auto'
                            ,icon: 1
                            ,time: 1000
                        });
                        }
                    });
            });
        }
        // 显示表单弹窗
        function showEditModel(mAuth,datas) {//mAuth用来判断是修改还是添加,datas是修改默认展示数据
            layer.open({
                type: 1,
                title: (mAuth ? '修改' : '添加') + '短信配置',
                content: $('#modelAuth').html(),
                success: function (layero, dIndex) {
                    $(layero).children('.layui-layer-content').css('overflow', 'visible');
                    if(mAuth == '添加'){
                            form.on('submit(modelSubmitAuth)', function (data) {
                            layer.load(2);
                            $.ajax({
                                url: layui.demo.interfaceUrl + '/sms/Sms/add_sms' 
                                ,data: {
                                session_key: localStorage.getItem('session_key'),
                                appid: data.field.appid,
                                secret: data.field.secret,
                                sign: data.field.sign,
                                template: data.field.template,
    
                                }
                                ,type: 'POST'
                                ,success:function(res){
                                if(res.status == 1){
                                    layer.msg(res.msg, {
                                    offset: 'auto'
                                    ,icon: 1
                                    ,time: 1000
                                }, function(){
                                    location.reload(true);
                                    layer.closeAll('loading');
                                    layer.close(dIndex);
                                });
                                }else if(res.status == 10010){
                                    layer.msg('您的账号已被迫下线,请重新登录', {// 登入成功的提示与跳转
                                    offset: 'auto'
                                    ,icon: 1
                                    ,time: 2000
                                    }, function(){
                                    location.href = 'user/login.html'; //后台主页
                                    });
                                }else{
                                    layer.closeAll('loading');
                                    layer.msg(res.msg); 
                                }
                                },
                                fail:function(){
                                layer.msg('网络异常', {
                                    offset: 'auto'
                                    ,icon: 1
                                    ,time: 1000
                                });
                                }
                            });
                            return false;
                        });
                    }else if(mAuth == '修改'){
                        form.val('modelAuthForm', datas);  // 回显数据
                        console.log(datas)
                        $('#modelAuthForm input[name="secret"]').val('******');
                        $('#modelAuthForm input[name="secret"]').prop('disabled',true);
                        form.on('submit(modelSubmitAuth)', function (data) {
                            if (data.field.parentId == '') {
                                data.field.parentId = '-1';
                            }
                            layer.load(2);
                            $.ajax({
                                url: layui.demo.interfaceUrl + '/sms/Sms/update_sms' 
                                ,data: {
                                session_key: localStorage.getItem('session_key'),
                                id: datas.id,
                                appid: data.field.appid,
                                sign: data.field.sign,
                                template: data.field.template,
    
                                }
                                ,type: 'POST'
                                ,success:function(res){
                                if(res.status == 1){
                                    layer.msg(res.msg, {
                                    offset: 'auto'
                                    ,icon: 1
                                    ,time: 1000
                                }, function(){
                                    location.reload(true);
                                    layer.closeAll('loading');
                                    layer.close(dIndex);
                                });
                                }else if(res.status == 10010){
                                    layer.msg('您的账号已被迫下线,请重新登录', {// 登入成功的提示与跳转
                                    offset: 'auto'
                                    ,icon: 1
                                    ,time: 2000
                                    }, function(){
                                    location.href = 'user/login.html'; //后台主页
                                    });
                                }else{
                                    layer.closeAll('loading');
                                    layer.msg(res.msg); 
                                }
                                },
                                fail:function(){
                                layer.msg('网络异常', {
                                    offset: 'auto'
                                    ,icon: 1
                                    ,time: 1000
                                });
                                }
                            });
                            return false;
                        });
                    }
                }
            });
        }
      });
      </script>
    

    效果图

    表格展示
    添加
    修改
    删除
    其中弹窗并没有用layui提供的script type=‘text/html’,如果这个弹窗里有下拉选择的内容需要动态渲染的话,用这个script引入就不进行渲染,我目前没有找到好的方法,但是用div给他加上display:none就能起到同样的效果。
    暂时就这些,欢迎各位大佬评论,批评我的代码规范。

    展开全文
  • layui生成菜单

    2020-03-30 17:35:23
    layuiAdmin生成菜单 ...ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu" lay-filter="layadmin-system-side-menu"> <li data-name="home" th:each="menuIndex: $...

    layui生成菜单


    thymeleaf渲染

    1

    <ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu" lay-filter="layadmin-system-side-menu">
    	<li data-name="home"  th:each="menuIndex: ${data}" class="layui-nav-item">
    	<a href="javascript:;"  lay-direction="2">
    	<cite><span th:text="${menuIndex.name}"></span></cite>
    	</a>
    	
    	<dl class="layui-nav-child" th:each="childNode: ${menuIndex.children}" >
    	<dd data-name="console" th:if="${#lists.isEmpty(childNode.children)}" >
    	    <a th:lay-href="${childNode.url}" th:text="${childNode.name}"></a>
    	</dd>
    	
    	<dd data-name="form" th:if="${not #lists.isEmpty(childNode.children)}">
    	    <a href="javascript:;" th:text="${childNode.name}"></a>
    	    <dl class="layui-nav-child" th:each="childNodetwo: ${childNode.children}">
    	       <dd><a th:lay-href="${childNodetwo.url}" th:text="${childNodetwo.name}"></a>				  </dd>
    	    </dl>
    	</dd>
    	</dl>
    	</li>
    </ul>

    2

    <ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu" lay-filter="layadmin-system-side-menu">
    	<li data-name="home"  th:each="menuIndex: ${data}" th:class="${menuIndex.getId()==1}?'layui-nav-item layui-nav-itemed':'layui-nav-item'">
    	<a href="javascript:;"  lay-direction="2">
    	<i class="layui-icon layui-icon-home"></i>
    	<cite><span th:text="${menuIndex.name}"></span></cite>
    	</a>
    	<dl class="layui-nav-child" th:each="childNode: ${menuIndex.children}" th:switch = "${childNode.children.size()==0 }">
    	<dd  th:case="true" data-name="console" th:class="${childNode.getId()==11}?'layui-this'"  >
    	<a th:lay-href="${childNode.url}" th:text="${childNode.name}"></a>
    	</dd>
    	<dd th:case="false" data-name="form">
    	<a href="javascript:;" th:text="${childNode.name}"></a>
    	<dl class="layui-nav-child" th:each="childNodetwo: ${childNode.children}">
    	<dd><a th:lay-href="${childNodetwo.url}" th:text="${childNodetwo.name}"></a></dd>
    	</dl>
    	</dd>
    	</dl>
    	</li>
    	</ul>

    js渲染

    <script>
        layui.config({
            base: '[[@{/layuiadmin/}]]' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index', 'user', 'element', 'form'], function () {
            var $ = layui.$
                , setter = layui.setter
                , admin = layui.admin
                , form = layui.form
                , router = layui.router()
                , search = router.search
                , element = layui.element;
    
            $.ajax({
                url: "/manage/findMenu",
                success: function (succ) {
                    console.log(succ);
                    for (var i = 0; i < succ.data.length; i++) {
                        if (succ.data[i].url == '#') {
                            var str1 = '<a href="javascript:;" lay-tips=' + '"' + succ.data[i].url + '"' + ' lay-direction="2" >'
                                + '<cite>' + succ.data[i].name + '</cite></a>';
                        }
                        var str2 = '';
                        var str0 = '';
                        var str3 = '';
                        var str8='';
                        var str9='';
                        var arr = succ.data[i].children;
                        for (var j = 0; j < arr.length; j++) {
                            str0 = '<dl class="layui-nav-child">';
                            str3 = '</dl>';
                            str8= '</dd>';
    
                            var str7 = '';
                            var arr1 = arr[j].children;
                            if(arr1.length>0){
                                str2 = '<dd data-name="form"><a lay-href=' + '"' + arr[j].url + '"' + '>' + arr[j].name + '</a>';
                            }else{
                                str2 = '<dd data-name="console"><a lay-href=' + '"' + arr[j].url + '"' + '>' + arr[j].name + '</a>';
                            }
                            if (arr1.length == 0){
                            }else {
                                for (var j1 = 0; j1 < arr1.length; j1++) {
                                    str7 += '<dl class="layui-nav-child">'
                                        + '<dd><a lay-href=' + '"' + arr1[j1].url + '"' + '>' + arr1[j1].name + '</a></dd>'
                                        + '</dl>'
                                }
                            }
                            str9 +=str0+str2+str7+str8+str3;
                        }
                        var str4 = '<li data-name="home" class="layui-nav-item">';
                        var str5 = '</li>';
                        var str6 = str4 + str1 +str9+ str5;
                        $("#layadmin-system-side-menu").append(str6);
                        element.init();
                    }
                }
                , error: function () {
                    layer.msg("请求失败");
                }
            });
        });
    </script>

    页面 id要和lay-filter 一样

    <ul class="layui-nav layui-nav-tree" lay-shrink="all" id="layadmin-system-side-menu"
               lay-filter="layadmin-system-side-menu">
    展开全文
  • <div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-pagetwo"> <div carousel-item id="LAY-index-pagetwo"> <div><i class="layui-icon layui-icon-...
    13079544-e4130f4b55b5c7bf.png
    效果图
    layui.define(function(exports){
      var admin = layui.admin;
      
      //区块轮播切换
      layui.use(['admin', 'carousel'], function(){
        var $ = layui.$
        ,admin = layui.admin
        ,carousel = layui.carousel
        ,element = layui.element
        ,device = layui.device();
    
        //轮播切换,这一段必须要,不然echarts无法完成渲染
        $('.layadmin-carousel').each(function(){
          var othis = $(this);
          carousel.render({
            elem: this
            ,width: '100%'
            ,arrow: 'none'
            ,interval: othis.data('interval')
            ,autoplay: othis.data('autoplay') === true
            ,trigger: (device.ios || device.android) ? 'click' : 'hover'
            ,anim: othis.data('anim')
          });
        });
    
        element.render('progress');
    
      });
    
    
    
      //访问量
      layui.use(['carousel', 'echarts'], function(){
        var $ = layui.$
        ,carousel = layui.carousel
        ,echarts = layui.echarts;
        
        var echartsApp = [], options = [
          {
            tooltip : {
              trigger: 'axis'
            },
            calculable : true,
            legend: {
              data:['访问量','下载量','平均访问量']
            },
            
            xAxis : [
              {
                type : 'category',
                data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
              }
            ],
            yAxis : [
              {
                type : 'value',
                name : '访问量',
                axisLabel : {
                  formatter: '{value} 万'
                }
              },
              {
                type : 'value',
                name : '下载量',
                axisLabel : {
                    formatter: '{value} 万'
                }
              }
            ],
            series : [
              {
                name:'访问量',
                type:'line',
                data:[900, 850, 950, 1000, 1100, 1050, 1000, 1150, 1250, 1370, 1250, 1100]
              },
              {
                name:'下载量',
                type:'line',
                yAxisIndex: 1,
                data:[850, 850, 800, 950, 1000, 950, 950, 1150, 1100, 1240, 1000, 950]
              },
              {
                name:'平均访问量',
                type:'line',
                data:[870, 850, 850, 950, 1050, 1000, 980, 1150, 1000, 1300, 1150, 1000]
              }
            ]
          }
        ]
        ,elemDataView = $('#LAY-index-pagetwo').children('div')
        ,renderDataView = function(index){
          echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
          echartsApp[index].setOption(options[index]);
          window.onresize = echartsApp[index].resize;
        };
        //没找到DOM,终止执行
        if(!elemDataView[0]) return;
        //请求服务端获取到数据后渲染图表
         //admin.req({
          // url: layui.setter.url + '/url'
           //, type: 'post'
          // , data: PARAM_DATE
           //, done: function (res) { //这里要说明一下:done 是只有 response 的 code 正常才会执行。而 succese 则是只要 http 为 200 就会执行
             //$.each(getRecentDay(-7,res.data), function(index, tmp) {
               //categories.push(tmp.reg_date);
             //  data.push(tmp.reg_num);
             //});
            renderDataView(0);
          //}
       //});
        
      });
    
      exports('test', {})
    });
    

    引用图表插件:

    
    <div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-pagetwo">
          <div carousel-item id="LAY-index-pagetwo">
             <div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>
         </div>
    </div>
    <script>
        layui.config({
            base: '/frame/layuiadmin/' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index', 'test']);
    
    </script>
    

    原文作者技术博客:https://www.jianshu.com/u/ac4daaeecdfe

    展开全文
  • //获得 lay-event 对应的值 var tr = obj.tr; //获得当前行 tr 的DOM对象 if(layEvent === 'edit'){}} 其他参数 - 与layui 的 table 一致,官方文档 注意: 子表的没有 elem 参数 3⃣️ 示例 var myTable = ...
  • layuiAdmin单页版文档

    千次阅读 2020-12-23 03:51:38
    我叫:贤心 公的 模板基础属性 动态模板支持以下基础属性lay-url用于绑定模板的数据接口地址,支持动态模板解析,如: lay-type用于设定模板的接口请求类型(默认:get),如: lay-data用于定义接口请求的参数,其...
  • layui table

    2021-08-16 20:57:20
    1.off移除on绑定的事件 2.列checkbox列single属性单选 3.render时changes属性可以动态改变列 4.初始化时rowStyleFormatter可以根据值改变行样式,rowClassFormatter可以根据值改变行css样式 ...th lay-data="{
  • 你好,我是承和。今天给大家分享一下我对于浏览器渲染以及优化方面的一些理解。传统面试题我们在各种面试题以及面试中都大概率看到过这个题目,浏览器在拿到数据后到最终呈现在⻚面上经历了哪些过程?这...
  • CRM -营销管理

    2022-05-06 21:29:33
    /** * 营销机会列表展示 */ var tableIns = table.render({ //返回表格渲染的唯一标识 elem: '#saleChanceList', // 表格绑定的ID url : ctx + '/sale_chance/list', // 访问数据的地址 cellMinWidth : 95, page : ...
  • //主入口模块 } ) . use ( [ 'index' , 'navbar' , 'layer' ] , function ( ) { // 从这里开始我加入的 var navbar = layui . navbar ( ) ; navbar . set ( { elem : '#nav' , data :...
  • EASY spa单页面版文档

    千次阅读 2020-07-01 14:32:59
    1.1.导入项目 下载项目后进行解压 使用IDEA、WebStorm、HBuilder等前端开发工具打开 打开index.html点击右上角浏览器图标运行: ... 1.2.项目结构 ...| |-main.js // 入口js | |-libs // 第三方库,ech.
  • 官网入口https://fly.layui.com/extend/layarea/ layarea.js 以及layui.js请从官网下载 <div class="layui-form-item" id="area-pickers"> <label class="layui-form-label">选择地区</label> ...
  • //table的渲染就不给出来了 //监听工具条 table . on ( 'tool(LAY-user-manage)' , function ( obj ) { //注:tool 是工具条事件名 var data = obj . data ; //获得当前行数据 ...
  • 创建Menu类 创建menu类,键名必须和layui文档一致,否则不能读取数据 public class Menu { private int id; private String title; private int pId; private List<... children = new ArrayList<...data =
  • 每个独立的线程有一个程序运行的入口、顺序执行序列和程序的出口。但是线程不能够独立执行,必须依存在应用程序中,由应用程序提供多个线程执行控制。  从逻辑角度来看,多线程的意义在于一个应用程序中,有多个...
  • 由于单页面版本的视图文件和静态资源模块都是动态加载的,所以可能存在浏览器的本地缓存问题,因此,为了避免改动后的文件未及时生效,只需在入口页面(默认为start/index.html)中,找到layui.config,修改其...
  • table id="LAY-user-manage" lay-filter="LAY-user-manage" class="layui-hide"></table> <!-- 行工具栏--> <script type="text/html" id="table-useradmin-webuser"> <a class="layui-...
  • //主入口模块 }).use(['index', 'treeTable'], function () { var $ = layui.$ , table = layui.table , form = layui.form , admin = layui.admin; var treeTable = ...
  • //渲染视图 Class.prototype.render = function () { var that = this , options = that.config; options.elem = $(options.elem); var elemTmp = options.elem; var placeholder = elemTmp.attr("placeholder") ? ...
  • layui教程---table

    千次阅读 2021-01-27 04:26:40
    示例1:自动渲染的重载 table.reload(‘idTest‘, { url:‘/api/table/search‘,where: {}//设定异步数据接口的额外参数 //,height: 300 }); 示例2:方法级渲染的重载 //所获得的 tableIns 即为当前容器的实例 ...
  • //渲染视图 Class.prototype.render = function () { var that = this , options = that.config; options.elem = $(options.elem); var elemTmp = options.elem; var placeholder = elemTmp.attr("placeholder") ? ...
  • }) }, // 控制菜单点击渲染右侧模板 menuEvent:function () { $("#asideapp").find(".byte-menu-item").on("click", function () { var href = $(this).data("href"); // $.get(href, function (res) { // $("#ksd-...
  • layui-soul-table

    千次阅读 2020-12-23 15:57:33
    给 layui-table 注入点灵魂 扩展功能 表头筛选、自定义条件(支持前端筛选、后台筛选介绍请...渲染入口render() soulTable.render(this) 使用在 table.render() 的 done 内,如果需要使用此插件中的任何功能都需要有这...
  • layuiAdmin pro (单页版)是完全基于 layui 架构而成的后台管理模板系统,可以更轻松地实现前后端分离,它是 mvc 的简化版,全面接管视图和页面路由,并可自主完成数据渲染,服务端通常只负责数据接口,而前端只需...
  • layui 多选下拉选项 第三方 xm-select 问题合集

    千次阅读 热门讨论 2020-05-17 04:55:09
    layui 多选下拉选项 第三方 xm-select 摘要遇到的问题(后续有再更新)1....因为要花额外的精力改代码,当然改完,心情还是愉悦的,xm-select使用了新的开发方式, 利用preact进行渲染, 大幅度提高渲染
  • <select class="form-control" lay-filter="province" id="province" lay-verify="required" data-province="-- 省 --"> <div class="form-group"> <select class="form-control" lay-filter...
  • 资源引入注意,通常入口文件中会配置静态资源根目录为/public 当服务器开启时,通过 地址+/(localhost:8080/) 就是到public目录下 所以引入资源就像这样 layui里面有两个js文件,layui.js小一点,使用到一些功能...
  • layuiAdmin 框架单页面文档

    万次阅读 2019-08-29 00:58:59
    由于 layuiAdmin 可采用前后端分离开发模式,因此你无需将其放置在你的服务端 MVC 框架中,你只需要给 layuiAdmin 主入口页面(我们也称之为:宿主页面)进行访问解析,它即可全权完成自身路由的跳转和视图的呈现,...

空空如也

空空如也

1 2 3 4 5 ... 7
收藏数 129
精华内容 51
关键字:

lay-data自动渲染 入口