css - How to show arraylist of Strings in p:dataGrid? -

css - How to show arraylist of Strings in p:dataGrid? -

i have ajax functionality add together names , show on same page in table manner 1 image(on left of text) , 1 "x" image(on right delete). should added like, left right , after completing 1 row, should start next row.

so need show arraylist of string in p:datagrid or other tag can used same functionality.

i tried combination of ui:repeat , p:panelgrid unable datagrid funtionallty. did not used p:datatable because add together new element on bottom side not need.

p.s.

<h:form> <h:selectonemenu id="recepients" value="#{controller.selected}"> <f:selectitem itemlabel="select" itemvalue=""></f:selectitem> <f:selectitem itemlabel="info1" itemvalue="info1"></f:selectitem> <f:selectitem itemlabel="info2" itemvalue="info2"></f:selectitem> <f:selectitem itemlabel="info3" itemvalue="info3"></f:selectitem> <f:selectitem itemlabel="info4" itemvalue="info4"></f:selectitem> <f:selectitem itemlabel="info5" itemvalue="info5"></f:selectitem> </h:selectonemenu> <p:commandbutton value="add" action="#{controller.submit}" update="nameslist" /> <p:datagrid id="nameslist" value="#{controller.tempnamelist}" var="name" columns="3"> <p:column> <p:outputlabel value="%" /> </p:column> <p:column> <p:outputlabel value="#{name}" /> </p:column> <p:column> <p:commandlink value="x" action="#{controller.delete(name)}" update="nameslist"> </p:commandlink> </p:column> </p:datagrid> </h:form>

the result should this...

% abc x % xyz x % dfd x

plz consider % image , x close symbol

the <p:datagrid> doesn't back upwards <p:column>. column layout applicable <p:datatable>.

replace <p:column> single grouping component, e.g. <h:panelgroup> or maybe <p:panel>, shown on showcase site.

<p:datagrid id="nameslist" value="#{controller.tempnamelist}" var="name" columns="3"> <h:panelgroup> <p:outputlabel value="%" /> <p:outputlabel value="#{name}" /> <p:commandlink value="x" action="#{controller.delete(name)}" update="nameslist" /> </h:panelgroup> </p:datagrid>

css jsf datagrid primefaces panel