Axure:中繼器實現表單增刪改查

2 評論 16429 瀏覽 60 收藏 12 分鐘

在用Axure的時候,怎么通過中繼器實現表單的增刪改查呢?本文分享了一個方法。

使用中繼器設計表單,如下:

一、分析

  1. 在文本框中輸入學號,姓名,成績,班級,點擊“新增”可新增一行信息流;
  2. 點擊左邊“復選框”,選擇一條需要刪除的數據,點擊“刪除”,可刪除已標記信息;
  3. 點擊左邊“復選框”,選擇一條需要修改的數據,點擊“編輯”,可修改已標記信息;
  4. 輸入表頭信息,點擊“查詢”,可查詢所需信息;
  5. 向左雙箭頭,表示“前一頁”;
  6. 向左單箭頭,表示“首頁”;
  7. 向右雙箭頭,表示“后一頁”;
  8. 向右單箭頭,表示“尾頁”;
  9. 雙箭頭中間矩形框,表示“當前數據行/總數據行”;
  10. 向右單箭頭的右邊矩形框,表示“共多少條數據”。

二、設計

備注:以下步驟,可先設置中繼器,再完成其他的操作。

步驟1:添加4個文本框,分別命名為input_ID、input_Name、Input_Grade、Input_Class,Ctrl+G組合命名為Input。

步驟2:添加向左雙箭頭元件、向左單箭頭件、向左雙箭頭右件、向左單箭右件、兩個矩形,如下:

步驟2.1 向左雙箭頭用例:

設置當前頁為“Previous”,代表上一頁。

步驟2.2 向左單箭頭件用例設置:

設置當前頁的值為1,代表首頁。

步驟2.3 向右雙箭頭用例設置:

設置當前頁的為NEXT,代表下一頁。

步驟2.4 向右單箭頭用例設置。

設置當前頁為LAST,代表最后一頁。

步驟2.5 雙箭頭中間矩形框“當前數據行/總數據行”用例設置。

設置變量,選擇中繼器、數據集中的變量visibleItemCount,代表當前頁當前頁面中所有可見項的數量。

itemCount代表當前過濾器中的項的個數。

備注,中繼器函數說明:

  • Item:中繼器的項
  • Item.Column0:中繼器數據集的列明
  • index:中繼器項的索引
  • isFirst:中繼器的項是否為第一個
  • isLast:中繼器的項是否為最后一個
  • isEven:中繼器的項是否為偶數
  • isOdd:中繼器的項是否奇數
  • isMarked:中繼器的項是否被標記
  • isVisible:中繼器的項是否可見
  • repeater:返回當前項的父中繼器
  • visibleItemCount:當前頁面中所有可見項的數量
  • itemCount:當前過濾器中的項的個數
  • datacount:中繼器數據集中所有項的個數
  • pagecount:中繼器中總共的頁面數
  • pageindex:當前的頁數

步驟2.6 向右單箭頭的右邊矩形框,“共多少條數據”用例設置。

函數使用:datacount,代表中繼器數據集中所有項的個數。

步驟3:插入“中繼器”元件(以下數據后續會添加,請做參考),命名為“List”。

步驟3.1,雙擊“中繼器”,在List(index)頁面中,復制5個矩形框,在第一個矩形框中,拖入一個“復選框”,如下:

中繼器中復選框用例設置分析:

當選中時,List數據集此行顯示為true

當取消選擇時,List數據集此行顯示為False

備注:取消標記具體設置略。

步驟3.2? 在中繼器中添加數據

步驟3.3?在中繼器中設置用例,用例設置為“每項載入時”,同時設置“載入時”每頁顯示項目數,如下:

步驟4?設置List表頭,復制5個矩形,表頭分別為學號、姓名、成績、班級,以及在第一個矩形框中添加復選框,命名為全選。

“全選”用例設置分析:

當選擇時,中繼器中的復選框全部選中;

當取消選擇時,中繼器中的復選框全部取消選中;

備注:取消選擇具體設置略。

步驟5:添加四個功能按鈕元件,分別命名為新增、刪除、編輯、查詢。

步驟5.1 新增用例設置

點擊“添加行”在每一個字段下面添加局部變量LVAR1,局部變量取值為input文本框對應的字段。

步驟5.2 刪除用例設置

步驟5.3 編輯用例設置

步驟5.4 查詢用例設置

函數使用indexOf函數:indexOf(‘searchValue’,start) 用途:從左至右獲取查詢字符串在當前文本對象中首次出現的位置。未查詢到時返回值為-1。 參數:searchValue為查詢的字符串;start為查詢的起始位置。

記得F5預覽哦。

以下為原形下載鏈接,歡迎下載。

鏈接:https://pan.baidu.com/s/1d_k9oWjnKdZhVhYB8SYpqA 密碼:y30d

 

本文由 @小甜甜不甜 原創發布于人人都是產品經理。未經許可,禁止轉載

題圖來自 Pexels ,基于 CC0 協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發揮!