zoukankan      html  css  js  c++  java
  • layui实现点击按钮添加行(方法渲染创建的table)

    / jquery实现的搜索功能
        $('#search_btn').on('click',function(){
            var txt=$('#inputValue').val();
            var value=$('.layui-colla-content');
            if($.trim(txt)!=""){
                $(".layui-colla-content").css('display','none').filter(":contains('"+txt+"')").show().css("color","red");
            }else{
                alert('111');
            }
        })
    
    table.render({  
             elem: '#baseInfo'  
              ,data:tableData  
              ,cols: [[  
              {title : '序号',type:'numbers',Width: 20}  
                /*  ,{field:'tableId'  , title:'tableId' } 
                 ,{field:'dbId'     , title:'dbId'    } */  
                 ,{field:'colNo'    , title:'colNo'   , sort: true}  
                 ,{field:'domainId' , title:'domainId', minWidth: 120, templet: '#switchTpl', unresize: true }  
                 ,{field:'colName'  , title:'colName' , minWidth: 120, sort: true           , edit: 'text'}  
                 ,{field:'typeName' , title:'typeName', minWidth: 120, sort: true   ,templet: '#selectTpl'}  
                 ,{field:'scale'    , title:'scale'   , minWidth: 80,  edit: 'text'}  
                 ,{field:'notNull'  , title:'notNull' , minWidth: 100, templet: '#switchNullTpl', unresize: true}  
                   ]]  
              ,page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档  
               layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局  
               ,curr: 1 //设定初始在第 1 页  
               ,groups: 1 //只显示 1 个连续页码  
               ,first: false //不显示首页  
               ,last: false //不显示尾页  
             }  
              , done: function(res, curr, count){  
                   }  
      
           });  
    table.render({  
             elem: '#baseInfo'  
              ,data:tableData  
              ,cols: [[  
              {title : '序号',type:'numbers',Width: 20}  
                /*  ,{field:'tableId'  , title:'tableId' } 
                 ,{field:'dbId'     , title:'dbId'    } */  
                 ,{field:'colNo'    , title:'colNo'   , sort: true}  
                 ,{field:'domainId' , title:'domainId', minWidth: 120, templet: '#switchTpl', unresize: true }  
                 ,{field:'colName'  , title:'colName' , minWidth: 120, sort: true           , edit: 'text'}  
                 ,{field:'typeName' , title:'typeName', minWidth: 120, sort: true   ,templet: '#selectTpl'}  
                 ,{field:'scale'    , title:'scale'   , minWidth: 80,  edit: 'text'}  
                 ,{field:'notNull'  , title:'notNull' , minWidth: 100, templet: '#switchNullTpl', unresize: true}  
                   ]]  
              ,page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档  
               layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局  
               ,curr: 1 //设定初始在第 1 页  
               ,groups: 1 //只显示 1 个连续页码  
               ,first: false //不显示首页  
               ,last: false //不显示尾页  
             }  
              , done: function(res, curr, count){  
                   }  
      
           });  
    table.render({  
             elem: '#baseInfo'  
              ,data:tableData  
              ,cols: [[  
              {title : '序号',type:'numbers',Width: 20}  
                /*  ,{field:'tableId'  , title:'tableId' } 
                 ,{field:'dbId'     , title:'dbId'    } */  
                 ,{field:'colNo'    , title:'colNo'   , sort: true}  
                 ,{field:'domainId' , title:'domainId', minWidth: 120, templet: '#switchTpl', unresize: true }  
                 ,{field:'colName'  , title:'colName' , minWidth: 120, sort: true           , edit: 'text'}  
                 ,{field:'typeName' , title:'typeName', minWidth: 120, sort: true   ,templet: '#selectTpl'}  
                 ,{field:'scale'    , title:'scale'   , minWidth: 80,  edit: 'text'}  
                 ,{field:'notNull'  , title:'notNull' , minWidth: 100, templet: '#switchNullTpl', unresize: true}  
                   ]]  
              ,page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档  
               layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局  
               ,curr: 1 //设定初始在第 1 页  
               ,groups: 1 //只显示 1 个连续页码  
               ,first: false //不显示首页  
               ,last: false //不显示尾页  
             }  
              , done: function(res, curr, count){  
                   }  
      
           });  
    table.render({  
             elem: '#baseInfo'  
              ,data:tableData  
              ,cols: [[  
              {title : '序号',type:'numbers',Width: 20}  
                /*  ,{field:'tableId'  , title:'tableId' } 
                 ,{field:'dbId'     , title:'dbId'    } */  
                 ,{field:'colNo'    , title:'colNo'   , sort: true}  
                 ,{field:'domainId' , title:'domainId', minWidth: 120, templet: '#switchTpl', unresize: true }  
                 ,{field:'colName'  , title:'colName' , minWidth: 120, sort: true           , edit: 'text'}  
                 ,{field:'typeName' , title:'typeName', minWidth: 120, sort: true   ,templet: '#selectTpl'}  
                 ,{field:'scale'    , title:'scale'   , minWidth: 80,  edit: 'text'}  
                 ,{field:'notNull'  , title:'notNull' , minWidth: 100, templet: '#switchNullTpl', unresize: true}  
                   ]]  
              ,page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档  
               layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局  
               ,curr: 1 //设定初始在第 1 页  
               ,groups: 1 //只显示 1 个连续页码  
               ,first: false //不显示首页  
               ,last: false //不显示尾页  
             }  
              , done: function(res, curr, count){  
                   }  
      
           });  
    //点击加号按钮时,新添一行  
         $("#addTable").click(function(){  
              var oldData =  table.cache["baseInfo"];  
              var data1={"colName":"ID2","colNo":0,"collator":"","comments":"","dbId":1,"defVal":"","deleted":"","dispersion":0,"domainId":0,"histogram":"","isHide":"","isSerial":"F","isVirtual":"","maxVal":"","minVal":"","notNull":"T","repetRate":0,"scale":-1,"serialId":0,"tableId":1048586,"timestampT":" ","typeName":"INTEGER","varying":"F","vcolNo":0,"vertNo":0};  
              oldData.push(data1);  
              table.reload('baseInfo',{  
                  data : oldData  
              });  
         });  
  • 相关阅读:
    NetCore3.1,NetCore5.0让发布的时候可以展示views
    Mac配置Gradle环境变量
    [转] 聊聊OkHttp实现WebSocket细节,包括鉴权和长连接保活及其原理!
    spark hive 数据不一致 spark默认本地数据元 spark不能插入hive数据
    UnicodeDecodeError: 'utf-8' codec can't decode byte 0xb8 in position 885: invalid start byte
    hadoop+zookeeper+yarn+spark高可用主从备份启动步骤
    Java笔记
    cnblogs设置
    IC Test Note
    复制文件夹下所有文件文件名
  • 原文地址:https://www.cnblogs.com/yangguoe/p/9045532.html
Copyright © 2011-2022 走看看