p:autocomplete issue in ui:repeat

[sdefeo1]

PF 3.2 / JSF 2.0 / Tomcat 6.0
Hello, we have a page who is doing a loop about parameter using a datatable and ui:repeat tag to generate dynamically a form.
It's running pretty good but not with the p:autocomplete tag.

The event is fired but no action reach to the server.

The snippet below shows how it is called

Code: Select all

<?xml version="1.0" encoding="UTF-8" ?>
<ui:composition xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	template="templates/template.xhtml">

	<ui:define name="content-page-txt">
		<h:form id="principal">
			<p:panel id="formulaire">
				<h:dataTable var="theme"
					value="#{FormController.currentForm.allThemes}" style="width:100%;">
					<h:column>
						<p:panel id="theme#{theme.label}" style="width:100%;">
							<h:dataTable var="row" value="#{theme.allRows}"
								style="width:100%;">
								<h:column>
									<table width="100%">
										<tr>
											<ui:repeat var="item" value="#{row.allFields}">
												<td style="">
													<p:autoComplete name="#{item.name}"
														value="#{item.value}"
														rendered="#{item.type == 'TEXT_AUTO_COMPLETE'}"
														completeMethod="#{item.completeHandler.complete}"/>
                                                                                                        <h:selectOneMenu   value="#{item.value}" rendered="#{item.type == 'MENU'}" >
					          					                         <f:selectItems value="#{item.possibleValues}" var="c"	itemLabel="#{c.label}" itemValue="#{c.value}" />
					          				                        </h:selectOneMenu>
												</td>
											</ui:repeat>
										</tr>
									</table>
								</h:column>
							</h:dataTable>
						</p:panel>
					</h:column>
				</h:dataTable>
			</p:panel>
		</h:form>
	</ui:define>
</ui:composition>

the generated HTML :

Code: Select all

<td>
   <span id="principal:j_idt21:1:j_idt24:1:j_idt29:0:j_idt36" class="ui-autocomplete">
   <input id="principal:j_idt21:1:j_idt24:1:j_idt29:0:j_idt36_input" name="principal:j_idt21:1:j_idt24:1:j_idt29:0:j_idt36_input" type="text" class="ui-autocomplete-input ui-inputfield ui-widget ui-state-default ui-corner-all" autocomplete="off" value="" />
<div id="principal:j_idt21:1:j_idt24:1:j_idt29:0:j_idt36_panel" class="ui-autocomplete-panel ui-widget-content ui-corner-all ui-helper-hidden ui-shadow"></div>
</span>
<script id="principal:j_idt21:1:j_idt24:1:j_idt29:0:j_idt36_s" type="text/javascript">                                                                                               $(function(){PrimeFaces.cw('AutoComplete','widget_principal_j_idt21_1_j_idt24_1_j_idt29_0_j_idt36',{id:'principal:j_idt21:1:j_idt24:1:j_idt29:0:j_idt36'});});
</script>
</td>

Info : the p:autocomplete works outside the ui:repeat tag.

Does anyone have an idea ?

[smithh032772]

Interesting post/code/implementation.

Code: Select all

  <ui:repeat var="item" value="#{row.allFields}">
    <td style="">
       <p:autoComplete name="#{item.name}"
	  value="#{item.value}"
	  rendered="#{item.type == 'TEXT_AUTO_COMPLETE'}"
	  completeMethod="#{item.completeHandler.complete}"/>
	<h:selectOneMenu   value="#{item.value}" rendered="#{item.type == 'MENU'}" >
	 <f:selectItems value="#{item.possibleValues}" var="c"   itemLabel="#{c.label}" itemValue="#{c.value}" />
	</h:selectOneMenu>
    </td>
 </ui:repeat>

1. What happens when you remove name="#{item.name}"?
2. What happens when you replace name="..." with id="..."?
3. Is the following a reference to a valid managed bean? Is completeHandler a pointer to a managed bean?

Code: Select all

completeMethod="#{item.completeHandler.complete}"/>

4. Per the following, I would assume that "item" is just a POJO instead of a managed bean.

Code: Select all

<ui:repeat var="item" value="#{row.allFields}">

5. Long time ago (or earlier on in my development phase), I learned that my 'util' POJO cannot act/behave like a managed bean. I have an ordersController, which is the managed (viewScoped bean), and an OrderDisplayUtil, which is a POJO (plain old java object), and it is a private member of ordersController, and I can store data in OrderDisplayUtil which is retrieved by OrdersController, but as I stated earlier, I learned that the POJO cannot do same type of operations as managed bean.

Info : the p:autocomplete works outside the ui:repeat tag.

6. What does the code look like, when it is outside of ui:repeat? Does it still have the following, or something different? Please reply with p:autoComplete xhtml that works outside of ui:repeat, so I/we can analyze the difference.

Code: Select all

completeMethod="#{item.completeHandler.complete}"/>

7. Or you could try to replace ui:repeat with some bean logic that dynamically builds p:autoComplete like what BalusC is doing in this blog (URL below); please note, it is standard JSF UI component instead of Primefaces p:autoComplete.

http://balusc.blogspot.com/2006/06/usin ... eDatatable

[sdefeo1]

Thank's for your reply.

1. What happens when you remove name="#{item.name}"?

It's the same thing.

2. What happens when you replace name="..." with id="..."?

It's the same thing.

3. Is the following a reference to a valid managed bean? Is completeHandler a pointer to a managed bean?

Code: Select all

completeMethod="#{item.completeHandler.complete}"/>

I don't understand your question. This "completeMethod" is ok outside the ui:repeat tag.

4. Per the following, I would assume that "item" is just a POJO instead of a managed bean.

Code: Select all

<ui:repeat var="item" value="#{row.allFields}">

"Item" is just a POJO.

6. What does the code look like, when it is outside of ui:repeat? Does it still have the following, or something different? Please reply with p:autoComplete xhtml that works outside of ui:repeat, so I/we can analyze the difference.

the generated code :

Code: Select all

<!-- inside ui:repeat (it doesn't works) -->
	<span id="principal:j_idt24:1:j_idt27:1:j_idt32:0:test">
		<input type="text" class="ui-inputfield ui-widget ui-state-default ui-corner-all ui-autocomplete-input ui-autocomplete-loading" 
			value="" name="principal:j_idt24:1:j_idt27:1:j_idt32:0:test_input" id="principal:j_idt24:1:j_idt27:1:j_idt32:0:test_input" 
			autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"/>
	</span>
	<script type="text/javascript">jQuery(function(){widget_principal_j_idt24_1_j_idt27_1_j_idt32_0_test = new PrimeFaces.widget.AutoComplete('principal:j_idt24:1:j_idt27:1:j_idt32:0:test', {url:'/geoportail/jsf/expedierFormulaire.xhtml',formId:'principal',pojo:false,maxResults:5});});
	</script>
	
<!-- outside ui:repeat (it works)-->
	<span id="principal:j_idt24:1:j_idt27:1:j_idt33">
		<input type="text" class="ui-inputfield ui-widget ui-state-default ui-corner-all ui-autocomplete-input" 
			name="principal:j_idt24:1:j_idt27:1:j_idt33_input" id="principal:j_idt24:1:j_idt27:1:j_idt33_input" 
			autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"/>
	</span>
	<script type="text/javascript">jQuery(function(){widget_principal_j_idt24_1_j_idt27_1_j_idt33 = new PrimeFaces.widget.AutoComplete('principal:j_idt24:1:j_idt27:1:j_idt33', {url:'/geoportail/jsf/expedierFormulaire.xhtml',formId:'principal',pojo:false,maxResults:5});});
	</script>

7. Or you could try to replace ui:repeat with some bean logic that dynamically builds p:autoComplete like what BalusC is doing in this blog (URL below); please note, it is standard JSF UI component instead of Primefaces p:autoComplete.

http://balusc.blogspot.com/2006/06/usin ... eDatatable

I don't know if it's a good idea because it's not a standard JSF tag but a personalized tag. But i will try this.

[smithh032772]

1. please reply with the Item POJO, so I can review it.
2. Is this the syntax for p:autoComplete (below), when it works outside of ui:repeat? If no/not, then please reply with the p:autoComplete xhtml syntax (not rendered code) which works outside of ui:repeat. I want to compare the two xhtml syntax (not rendered code).

Code: Select all

<p:autoComplete name="#{item.name}"
                          value="#{item.value}"
                          rendered="#{item.type == 'TEXT_AUTO_COMPLETE'}"
                          completeMethod="#{item.completeHandler.complete}"/>

[sdefeo1]

Hello,
We think of having understood the problem but we don't have any solution.
Our hypothesis : Facelet generate the element's ID (ui:repeat tag), and with p:autocomplete there is an ajax request to the server. But in the server, the element's ID generation is not made. So we think the server doesn't find the element's ID to the answer.

We think of it because we have the same behavior with the "update" attribute who don't work in a ui:repeat tag. And we can see it in the body of the HTTP request.

What do you think about this hypothesis ?

[smithh032772]

Well, honestly, I don't use ui:repeat, and I'm okay developing static xhtml that can be used dynamically, rendered dynamically, etc.... Since this is not working, I wish I knew more of your requirement, so I can advise another solution.

It might be best for you to create an issue in issue tracker, reference URL of this forum topic, provide good test case, that optimus prime can replicate, and then Optimus can mark issue as Accepted, Review, Fixed, CantReplicate, etc...

After you create the new issue, please reply here with the new issue # and URL of the new issue. I'll click Star on the new issue and cast my vote and monitor the status of the issue.

[andyba]

I am puzzled about something: you are setting a name attribute for your autocomplete components but I cannot for the life of me find documentation on it.

Code: Select all

<p:autoComplete name="#{item.name}"
                                          value="#{item.value}"
                                          rendered="#{item.type == 'TEXT_AUTO_COMPLETE'}"
                                          completeMethod="#{item.completeHandler.complete}"/>

[sdefeo1]

I am puzzled about something: you are setting a name attribute for your autocomplete components but I cannot for the life of me find documentation on it.

Yes, it's right. But it's not the problem.
The problem is solved if i don't use ui:repeat but p:datatable for exemple.
I will create a new issue this week about this.