fsLayui 是一個基于layui的快速開發(fā)插件，支持?jǐn)?shù)據(jù)表格增刪改查操作，提供通用的組件辩越，通過配置html實現(xiàn)數(shù)據(jù)請求，減少前端js重復(fù)開發(fā)的工作信粮。
GitHub下載 碼云下載
測試環(huán)境地址：http://fslayui.itcto.cn

多數(shù)據(jù)表格 和 單數(shù)據(jù)表格 類似黔攒，只是細節(jié)方面不一致，本不對數(shù)據(jù)表格進行詳細的介紹强缘，只介紹區(qū)別督惰，單數(shù)據(jù)表格請參考 fsLayui數(shù)據(jù)表格使用

多數(shù)據(jù)表格和單數(shù)據(jù)表格區(qū)別？

主要區(qū)別在于 數(shù)據(jù)表格id上旅掂，不同的數(shù)據(jù)表格id不同赏胚；
如果想要實現(xiàn)多數(shù)據(jù)表格，必輸指定數(shù)據(jù)表格id商虐，也就是 tableId 觉阅，例如在buttion按鈕設(shè)置 tableId 屬性崖疤。如果不設(shè)置默認(rèn) tableId 為 fsDatagrid ，渲染數(shù)據(jù)就不是想要的操作了。

demo

以下demo都有設(shè)置 tableId

<div class="layui-row grid-demo">
  <div class="layui-col-md12">
    <button class="layui-btn" function="top" topUrl="add.html" tableId="fsDatagrid2" topWidth="500px" topHeight="200px" topTitle="新增demo">
      <i class="layui-icon">&#xe654;</i>新增
    </button>
    <button class="layui-btn layui-btn-danger" function="submit" tableId="fsDatagrid2" url="/fsbus/1002" isSelect="1" isConfirm="1" confirmMsg="是否確定刪除選中的數(shù)據(jù)？" inputs="id:">
      <i class="layui-icon">&#xe640;</i>刪除
    </button>

    > <button class="layui-btn" function="refresh"
    ="fsDatagrid2">
      <i class="layui-icon">&#x1002;</i>刷新
    </button>
  </div>
  <div class="layui-col-md12">
     <table id="fsDatagrid2" lay-filter="fsDatagrid2" class="fsDatagrid" url="/fsbus/1000" isPage="1" defaultForm="query_form2" height="full-235"></table>
     <div class="fsDatagridCols">
        <p checkbox="true"/>
        <p field="id" title="ID" width="200" sort="true"/>
        <p field="name" title="名稱" width="300" sort="true"/>
        <p field="createdTime" title="創(chuàng)建時間" width="180"/>
        <p field="modifiedTime" title="修改時間" width="180"/>
        <p fixed="right" align="center" toolbar="#barDemo2" title="操作" width="150"/>
    </div>
      <script type="text/html" id="barDemo2">
      <a class="layui-btn layui-btn-xs" lay-event="top" topUrl="edit.html" topWidth="500px" topHeight="200px" topTitle="編輯demo" inputs="id:">編輯</a>
      <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="submit" url="/fsbus/1002" isConfirm="1" confirmMsg="是否確定刪除當(dāng)前記錄划乖？" inputs="id:">刪除</a>
    </script>
  </div>
</div>

本文首發(fā)于我的博客：ITCTO技術(shù)博客