1. 程式人生 > >Axure下拉框級聯操作

Axure下拉框級聯操作

現實生活中有很多的下拉框是級聯操作的,即因為第一個下拉框的選擇,影響到後面的下拉框的選擇的列表的資料。或許在程式碼中,這些操作相對比較簡單,通過前一個下拉框的選擇項來控制後一個下拉框的資料的動態新增。那麼,如何使用Axure來實現這一操作呢,下面提供了幾種方法進行參考。

下面我們以省市區的三級聯動來實現一下。

第一種實現方法

1、首先在頁面中放置三個下拉框,分別用來顯示:省、市、區,然後將第二個和第三個下拉框設定為動態面板,如下圖。

 

2、將第一個下拉框中新增資料,例如請選擇省份、安徽省和黑龍江省,然後在第二個市的動態面板中分別新增兩個面板狀態,名稱分別為安徽省和黑龍江省(此處強烈建議面板狀態的名字和其前一個下拉框中選項的名稱一致,因為這樣有利於後期操作),然後在其狀態面板中的下拉框中填寫該面板狀態名稱下的省份中的市級名稱,以同樣的方法新增對應市級城市的區域資訊。如下圖。

3、如果相應的資料已經新增好了,那麼我們開始進行互動的新增,選擇第一個下拉框,選擇【選項改變時】,然後選擇【編輯條件】在頁面中選擇選項為對應的省份,然後確定。在新增動作中選擇【設定面板狀態】,選擇對應的動態面板為市級的面板,然後在選擇狀態中選擇對應的之前設定的面板狀態和當前選擇的省名稱為同一個的面板狀態。如下圖。

4、同樣的操作方式,在區級下拉框中進行新增。

第二種實現方法

相對於第一種方法需要天機很多的事件,需要將省級、市級每個選項發生變化都需要新增事件。像這種資料量較大的來說相對繁瑣一些。第二種方法在第一種方法的基礎上,稍作修改,可以節省一定的繁瑣操作來實現。

其中第一種實現方法的【1】、【2】步驟是新增資料的,這部分不需要修改。那麼我們從第三步開始調整一下。

1、首先我們還是在省級的【選擇改變時】進行新增事件。選擇【設定面板狀態】,選擇對應的動態面板,在選擇狀態中選擇Value,然後在狀態名稱或者需要中填寫[[LVAR1]](可以自主新增),然後選擇後面的【fx】,按照下圖進行新增。點選確定後,即可實現省級和市級的聯動。參照下圖。

 

2、同樣的市級和區域中的聯動也是以同樣的方法,在此處相對的需要的操作還是多一些的,不過相對第一種方法已經是省去了很多的操作步驟,在新增區域性變數的時候,建議使用語義化的名稱。

 

以上是我現在瞭解的兩種實現方法,如後續有新的方法會繼續補充,也是剛開始接觸這個東東,如果有不合理的地方希望批評指教。

參考文件:

http://www.woshipm.com/rp/438724.html