Lauiuiデータテーブルの列を非表示にする方法の紹介-ライユイのチュートリアル-php.cn

Lauiuiデータテーブルの列を非表示にする方法の紹介

尚

リリース： 2019-12-14 16:57:54

転載

6100 人が閲覧しました

Lauiuiデータテーブルの列を非表示にする方法の紹介

layui を使用してデータテーブルを作成する場合、挿入されたデータの ID が連続した数字の集合である場合、layui のcols の type 属性を使用する必要があります。

Lauiuiデータテーブルの列を非表示にする方法の紹介

 table.render({
    elem: &#39;#test&#39;
    ,url:&#39;${pageContext.request.contextPath}/findcustomers&#39;
    ,cols: [[
      {align:&#39;center&#39;, title: &#39;编号&#39;, sort: true,type:&#39;numbers&#39;,width:100}
    ]]
    ,page: true
  });

ログイン後にコピー

順序付けられたシーケンスを取得します (ps: ここに width 属性を追加する必要があります。minWidth の使用は役に立ちません。width が使用されない場合は、layui が使用されます)テーブルのデフォルトの幅は 40)

Lauiuiデータテーブルの列を非表示にする方法の紹介

次に、問題は、ID をどのように取得するかということです? ID 用に別の列を開くことができますか? ID が意味がある場合は、はい、意味がないけど必要な場合は、ID を非表示にした方が美しいでしょう。 layui のバージョン 2.4 より前では、layui のデータテーブルの Done パラメータを使用できました。

Lauiuiデータテーブルの列を非表示にする方法の紹介

  table.render({
    elem: &#39;#test&#39;
    ,url:&#39;${pageContext.request.contextPath}/findcustomers&#39;
    ,cols: [[
      {align:&#39;center&#39;, title: &#39;编号&#39;, sort: true,type:&#39;numbers&#39;,width:100}
      ,{field:&#39;cust_id&#39;, title: &#39;ID&#39;}
 
    ]]
     ,done:function(res,curr,count){ // 隐藏列
           $(".layui-table-box").find("[data-field=&#39;cust_id&#39;]").css("display","none");
           }
    ,page: true
  });

ログイン後にコピー

id は非表示にすることができますが、数十分 1 秒間、id 列が読み込まれて最終的に非表示になります。では、より効果的な方法はあるのでしょうか? Layui はロード時にのみ非表示にすることができます。そのため、layui のバージョン 2.4 では、layui のcols パラメータに新しい非表示属性が追加されました。

Lauiuiデータテーブルの列を非表示にする方法の紹介

  table.render({
    elem: &#39;#test&#39;
    ,url:&#39;${pageContext.request.contextPath}/findcustomers&#39;
    ,cols: [[
      {align:&#39;center&#39;, title: &#39;编号&#39;, sort: true,type:&#39;numbers&#39;,width:100}
      ,{field:&#39;cust_id&#39;, title: &#39;ID&#39;, hide:true}
 
    ]]
    ,page: true
  });

ログイン後にコピー

layui の詳細については、layui 使用法チュートリアル列に注目してください。

以上がLauiuiデータテーブルの列を非表示にする方法の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。