dynamically substitue id attribute for components

[jaya.prakash]

Hi,

I have one problem, for the PrimeFaces component I have to make the id attribute values as unique by dynamic, for example in a data table tag we can show the data's as rows and for each row I added a checkbox, where the user can select or deselect, so when the user selects the check box, the ajax functionality will update that particular check box component, for this the backend requires the id of that component, currently I can pass the id attribute value as hard coded, Can any body give some idea to solve this.

<p:dataTable .....>
<p:column>
<f:facet name="header">
<h:outputText value="Select" />
</f:facet>
<h:selectBooleanCheckbox id="name" value="#{name.checked}"> ---- here id is hardcoded which means for each row the id value is same, but i wanted to be dynamic for unique. I tried with id="#{name.id}", but I am getting "Empty id attribute is not allowed
" exception.
<p:ajax actionListener="#{name.updateSelection}" event="click"/>
</h:selectBooleanCheckbox>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Classificatin" />
</f:facet>
<h:outputText value="#{tweet.classification}" />
</p:column>
.............
Thanks in Advance,
Jaya Prakash K G

[Oleg]

Hi, it's simple. Here is an example from my web application

Code: Select all

	<h:panelGroup layout="block" styleClass="centredLayout">
		<c:set target="#{component}" property="id" value="#{idPrefix}OneColumnNestedLayout"/>
		<h:panelGrid styleClass="outer" columns="1">
			<h:panelGroup layout="block" styleClass="inside">
				<ui:insert/>
			</h:panelGroup>
		</h:panelGrid>
	</h:panelGroup>

With <c:set target="#{component}" property="id" value="...."/> you can set ID of the enclosed component (in my example for h:panelGroup).

Not forget to include

Code: Select all

xmlns:c="http://java.sun.com/jsp/jstl/core"

Best regards.
Oleg.

[jaya.prakash]

Hi Oleg,
Many thanks for your response, it's working, but i have another problem, the checkbox component is not working under <p:dataTable.. tag, means not showing mark and unmark when we click it . The same works fine when I use outside of the <p:dataTable.. tag.
please let me know if you have any idea or at least you may try the same.

My object is to show the data table along with a check box for each row and the user should able to select the check box for submiting those selected rows.

for reference:

(the rowselection is used to update other part in the same page)

<p:dataTable var="product" value="#{probuctbean.productList}" paginator="true" rows="10"
selection="#{probuctbean.selectedProduct}" selectionMode="single" update="display" onselect="display.show()">

<p:column>
<f:facet name="header">
<h:outputText value="Select" />
</f:facet>
<h:selectBooleanCheckbox id="checked" value="#{product.checked}">
</h:selectBooleanCheckbox>
</p:column>

<p:column>
<f:facet name="header">
<h:outputText value="Classification" />
</f:facet>
<h:outputText value="#{product.classification}" />
</p:column>
...........

Thanks and Regards,
Jaya Prakash

[jaya.prakash]

Hi Oleg,

I added as follows,
<h:selectBooleanCheckbox value="#{product.checked}">
<c:set target="#{component}" property="id" value="#{product.productId}"/>
<p:ajax actionListener="#{product.updateSelection}" event="click"/>
</h:selectBooleanCheckbox>

even though the check box's not showing the tick marks, the ajax actionLister works when clicked, (not works for update functionality ). so my idea is to refresh the dataTable when user clicks the check box, so that the check box tick marks can see, so I am looking for that.

Thanks,
Jaya Prakash

[Oleg]

Hi Jaya,

p:ajax has "process" and "update" attributes. Point "update" to your datatable. Maybe I didn't understand your problem.

[cagatay.civici]

You can also access selected product within p:ajax actionListener.

Code: Select all

<p:dataTable var="product" value="#{probuctbean.productList}" paginator="true" rows="10"
selection="#{probuctbean.selectedProduct}" selectionMode="single" update="display" onselect="display.show()">

<p:column>
<f:facet name="header">
<h:outputText value="Select" />
</f:facet>	
<h:selectBooleanCheckbox value="#{product.checked}"> 
    <p:ajax actionListener="#{productBean.handleProductCheck}" event="click">
        <f:setPropertyActionListener value="#{product}" target="#{productBean.selectedProduct}" />
    </p:ajax>
</h:selectBooleanCheckbox>	
</p:column> 

<p:column>
<f:facet name="header">
<h:outputText value="Classification" />
</f:facet>
<h:outputText value="#{product.classification}" />
</p:column>

[Oleg]

If you use JSF 2 and EL 2.x you can write even simpler with method parameter

Code: Select all

    <p:ajax action="#{productBean.handleProductCheck(product)}" event="click"/>

I always do that.

[jaya.prakash]

Hi Oleg,

Many thanks for your replay, the dynamic id attribute issue has solved and I mentioned earlier, the problem is with the check box, where it didn't show the visual changes when we click while using inside the <p:dataTable... tag. there is already a bug id (811) for this and id 854 shows that it was fixed by "cagatay.civici" . I hope it will come in the upcoming version.

For reference:

http://code.google.com/p/primefaces/iss ... &start=100

http://code.google.com/p/primefaces/iss ... ?id=854#c0

Once again thanks for your support.

Regards,
Jaya Prakash K G

[jaya.prakash]

Hi cagatay,

I saw that, the issue id 854 has fixed by you, I just want to know which version will have that fix.

Thanks and Regards,
Jaya Prakash

[jaya.prakash]

Hi cagatay,

I got it from 2.0.3 snapshot, sorry for the disturbance to you by my post as I was not look into latest release.

Thanks,
Jaya Prakash