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  
          });  
     });  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM