fsLayuiPlugin單頁面操做

概述

單頁面處理 新增、修改、查看詳情 共用同一個彈出的頁面。在線demo 數據表格2

使用

提供2種處理方式（主要區別區彈出窗口的html配置），根據實際狀況選擇使用那種方式。

1. 新增、修改功能共用一個按鈕，使用同一個servlet接口提交數據，經過路由判斷新增或修改；
2. 定義各自的新增或修改按鈕，和普通模式同樣，各自提交本身的servlet接口。

須要在按鈕中增長topMode標籤，描述彈出的模型（add：新增窗口，edit：編輯窗口，readonly：只讀窗口）。

• 新增窗口demo

<button class="layui-btn" function="top" topUrl="one.html" topMode="add" topWidth="800px" topHeight="600px" topTitle="新增demo">
  <i class="layui-icon">&#xe654;</i>新增
</button>

• 編輯窗口demo

<a class="layui-btn layui-btn-xs" lay-event="top" topUrl="one.html" topMode="edit" topWidth="800px" topHeight="600px" topTitle="編輯demo" inputs="id:">編輯</a>

• 查看詳情demo（只讀窗口）

<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="top" topUrl="one.html" topMode="readonly" topWidth="800px" topHeight="600px" topTitle="查看demo" inputs="id:">查看</a>

方式一

新增、修改功能共用一個按鈕，使用同一個servlet接口提交數據，經過路由判斷新增或修改；

此方式提交參數中會自帶一個系統參數_mode，servlet接口經過獲取此參數判斷新增或修改。
add:新增
edit:修改

<button class="layui-btn" lay-submit="" lay-filter="save" url="/fsbus/1006">保存</button>

方式二

定義各自的新增或修改按鈕，和普通模式同樣，各自提交本身的servlet接口。

特別說明：
新增和編輯按鈕必須設置特定的class樣式。經過樣式判斷隱藏和顯示。
新增按鈕須要配置fsAdd
編輯按鈕須要配置fsEdit

<button class="layui-btn fsAdd" lay-submit="" lay-filter="save" url="/fsbus/1001">新增</button>
<button class="layui-btn fsEdit" lay-submit="" lay-filter="edit" url="/fsbus/1004">編輯</button>

本文首發於個人博客： ITCTO技術博客