Это основной вид, содержащий элементы draggable
. В этом представлении у меня есть ui:include
для включения фрагмента интерфейса, который также имеет область перетаскивания.
mainView.xhtml
<p:dataList id="outerList" var="varOuter" value="#{myVO.getOuterList()}">
<div>
<span>#{varOuter.someVal}</span>
</div>
<p:dataList id="innerList" var="innerVar" value="#{myVO.getInnerList()}">
<div class="crew-list">
<h:form>
<h:panelGroup id="draggableItem" layout="block">
<span>#{innerVar.someVal}</span>
</h:panelGroup>
<p:draggable for="draggableItem" opacity="0.5" scope="ab"
revert="true" helper="clone" appendTo="@(body)" zindex="4" >
</p:draggable>
</h:form>
</div>
</p:dataList>
</p:dataList>
...
<ui:include src="fragment.xhtml">
<ui:param name="param" value="#{paramVal}" />
</ui:include>
fragment.xhtml
<p:dataList id="list" var="pos" value="#{myVO.getPositions()}" rowIndexVar="rowIndex">
<ui:fragment rendered="#{!pos.isFilled()}">
<h:panelGroup layout="block" id="dropArea">
<span>Drop Here</span>
</h:panelGroup>
<p:droppable for="dropArea" hoverStyleClass="active"
scope="ab" datasource=":outerList:innerList">
<p:ajax listener="#{crewChangeVO.onDrop}" update="list" />
<f:attribute name="index" value="#{rowIndex}" />
</p:droppable>
</ui:fragment>
</p:dataList>
Теперь проблема, с которой я сталкиваюсь, заключается в том, что я не могу правильно отобразить datasource
в droparea. Без datasource перетаскивание работает, но я не получаю данные (перетаскиваемый объект) в моем методе bean, и мне нужен способ узнать, какой объект был перетаскиван.
Предложите какие-либо сведения о том, как достичь этой функциональности.
Обновление Использование одного (не вложенного) списка данных в качестве источника с формой вне его работает. Но проблема в том, что он не работает для вложенного списка. Итак, на данный момент я приступаю к изменениям дизайна и удалению вложенного списка.