使用primefaces非常簡單,我們只需要將primefaces的jar文件包含到web模塊的庫里即可,這樣無論是試用jsp或xhtml,我們都能識別到primefaces的命名空間。據說richfaces 4 也將簡化其部署的方式,應該是和primefaces相似吧。
下面,就是講解一下如何使用primefaces的拖拽功能。應該說使用起來還是非常簡單的,不過這也耗費了我很多時間來研究。使用拖拽功能時主要使用了primefaces的兩個控件,就是:
<p:draggable for=”這里面指定哪個控件里的內容可以被拖拽” revert=”這里是boolean值,表明如果沒有拽到合適的位置,那么所拖拽的內容將回到其原來位置”/>
<p:droppable for=”指定哪個控件是可以被drop進的” database=”數據源是非常重要的,其指定了能拽到該放置區域的內容是屬於哪個控件的” tolerance=”這里說明的是如何才能評判用戶進行了有效地拖拽,我們使用的是touch,被拖拽的內容只要與可放置區域接觸,拖拽就能充公” dropListener=”#{這里是一個具有以DragDropEvent為類型的變量的方法}” onDropUpdate=”這里是列舉出所有需要更新的控件,當用戶進行了成功拖拽操作,列舉的是id並且用空格分開”/>
我這么解釋也許會難以理解,因此,如果有必要的話,請自己嘗試一下,可以依據demo的例子來進行。
由於我們的要求是允許在三個或三個以上的數據源之間進行拖拽,因此我嘗試了給同一個數據源注冊多個<p:droppable/>,但是不能實現,為了解決這個問題,我查閱了大量的資料,但是發現這個方法是不可行的,但是偶然間發現可以通過一些硬編碼的方式來實現多個數據源之間的拖拽,雖然不利於可擴展性,但是由於這個功能比較獨立,因此對未來的開發影響不是很大。
2.
圖片:

圖片:

圖片:

圖片:

【圖片一】
這樣,當我們從一個數據源將內容拖到可放置處時就會觸發dropListener里注冊的事件。代碼片段如下:
【圖片二】
這里primefaces已經為我們做的是DragDropEvent,每次拖拽成功都會初始化一個ddEvent的變量,該變量包含如下一些屬性,我用debug模式將其內容表示出來。
第一步是將一個內容從其數據源拖拽到另一個容器中去,如下所示:
【圖片三】
我嘗試將tec1拖拽到Utilisateurs組中去,此時,就會觸發dropListener方法,進入debug模式,從變量視圖中我們可以看到如下信息:
【圖片四】
這里包含了dragId和dropId,我們所作的就是同個這兩個id來獲得被拽的內容和將被放置的組的信息。之后讓程序繼續運行,我們就會看到如下結果:
【圖片五】
Tec1被放置到user1中去了。
具體的操作已經在代碼截圖中顯示了,應該比較清晰。
這樣我們就完成了多數據源之間的拖拽。
Tree - ContextMenu
Tree has exclusive support for context menu. Different menus can be attached to particular tree nodes by matching nodeType option to treeNode type.