layuiテーブルの列幅をパーセントで表示しました

   VAR層= layui.layer、形式= layui.form、テーブル= layui.table。
            VAR $ = layui $。
            / * gysmc、zyzw、XM、sjhm、bgshm、emilyx、選択
            zgsrgzwsj、zggsgl、gysxxidとして(intとしてgysxxid)キャスト、PC、
             IDなどgysryxxMdataID、gysryxxMdataからsjbs * / 
            VAR tableInit = table.render({ 
                elemは' #tbgysplay」
                、方法: 'ポスト' 
                データ:jsonData 
                、高さ: "自動" 
                、ID: "tbgysplay" テキスト:{なし: '暂无相关数据'} ツールバー: "#toolbarplan"  
                、COLS:[[
                    {タイプ:「チェックボックス」固定: ""左、
                        フィールド: "番号"、タイトル: " シリアル番号"、幅: '%5'、左=整列:テンプレット、 "左":機能(データ){ 
                            data.LAY_INDEXを返す
                        } 
                    }  
                    、{フィールド: "ID"、タイトル: "ID"、整列: "左"、非表示:真} 
                    、{フィールド: "アクション"、タイトル: "アクション"、整列は、 "左" 、非表示:真} 
                    、{フィールド: "sjbs"は、タイトル: "sjbs"、整列: "左"、非表示:真} 
                    、{フィールド: "供应商名称"、タイトル: "供給者名」、幅:'20% '左=整列: "左"} 
                    、{フィールド:"メイン製品タイプ"、タイトル: "主要製品タイプ"、幅:'20%'は、整列: '左'}
                    、{フィールド: "地方"、タイトル: "地方「は、幅:'15% '左=整列:'ところ'} 
                    、{ 
                        フィールド,: "PSA計画時間"、タイトル: "PSA計画時間"、幅:'20%'は、整列: '左'、編集: 、 '選択' 
                        テンプレットを:機能(D){ 
                            リターン' < INPUTのタイプ= "テキスト" の名前は= "rzrq"レイベリファイ= "確認" の値を" '+' +(d.rzrq || '')" =プレースホルダ= "選択時" 読み取り専用= "読み取り専用" クラス= "layui入力layui-INPUT-DATE" スタイル= "テキスト-ALIGN =左:センター" />「; 
                        }
                    } 
                    、{フィールド,: "PSAプロジェクトリーダー"、タイトル: "PSAプロジェクトリーダー"、幅:'20% '左=整列:'左'編集:'テキスト「} 
                ]] 
                、DONE:関数(){/ /コールバックの後にデータをレンダリングする際に実行
                    //日付コントロールの
                    $( "layui-INPUT-日付。")、各(関数(I){。
                        layui.laydate.render({ 
                            elemは:この、
                            フォーマット:「YYYY-MM -dd」、
                            DONE:関数(値、DATE){ 
                                (RES && res.data [I]){IF 
                                    $ .extend(res.data [I]、{ 'rzrq':値}) 
                                } 
                            } 
                        }); 
                    }); 
                    layer.closeAll(); 
                } 

            }); 
            //ダブルクリック編集行
            table.on( '編集(tbgysplay)' 、関数(OBJ){ 
                //テスト形式の電話オフィスの電話のメールボックス
            });

 

おすすめ

転載: www.cnblogs.com/luo1240465012/p/11423207.html