重新渲染阿贾克斯复合组件 [英] Rerendering composite component by ajax
问题描述
我已经构建复合组件女巫看起来是这样的：
I have build a composite component witch looks something like this:
<composite:interface>
<composite:attribute name="id" required="false" />
<composite:attribute name="label" required="true" />
</composite:interface>
<composite:implementation>
<h:panelGroup id="#{cc.attrs.id}">
<fieldset class="fieldset"><legend>${cc.attrs.label}</legend></fieldset>
</h:panelGroup>
</composite:implementation>
在compent正确显示当前标签。
The compent displays the current label correctly.
<xyz:comp id="idMyComponent" label="#{someBean.text}"/>
...
<a4j:ajax ... render="idMyComponent" />
...
现在时的动作是preformed没有任何反应。然而，当我添加一个后缀的ID在组件正常工作（见下文）。
Now when the action is preformed nothing happens. However when I add a Postfix to the ID in the component it works fine (see below).
...
<composite:implementation>
<h:panelGroup id="#{cc.attrs.id}Label">
...
而在定义ID渲染后缀：
And define the ID in render with the postfix:
<xyz:comp id="idMyComponent" label="#{someBean.text}"/>
...
<a4j:ajax ... render="idMyComponentLabel" />
...
可以对一些给我解释一下为什么只有当我添加一个后缀的ID在和H：？panelGroup中
推荐答案
这个问题实际上是两个倍。
This problem is actually two-fold.
第一个问题是，＆LT; XYZ：比较ID＆GT; 实际上指定的复合成分的自身的，在<$ C的ID $ C>＆LT; CC：实施＆GT; 。这是psented在HTML输出，因此AJAX / JavaScript不能用的document.getElementById（）和朋友找到它。
The first problem is that the <xyz:comp id> actually specifies the ID of the composite component itself, the <cc:implementation>. This is by default nowhere represented in HTML output and therefore ajax/JavaScript can't locate it by document.getElementById() and friends.
其实，你的＆LT; H：panelGroup中的id =＃{cc.attrs.id}＆GT; 结束了在生成的HTML输出如下（单击鼠标右键页面， 查看源文件的看到它自己）：
Actually, your <h:panelGroup id="#{cc.attrs.id}"> ends up in generated HTML output as follows (rightclick page and View Source to see it yourself):
<span id="idMyComponent:idMyComponent">
第二个问题是RichFaces的/ Ajax4jsf的增强JSF组件的引用/的发现，相对于客户端ID树（即不是以：）由不仅搜索在当前的背景下 NamingContainer ，而且在所有其他 NamingContainer 组件。复合组件是天生也是一个 NamingContainer 部分。
The second "problem" is that RichFaces/Ajax4jsf has enhanced the referencing/finding of JSF components in the tree by relative client ID (i.e. not starting with :) by not only searching in the context of the current NamingContainer, but also in all other NamingContainer components. A composite component is inherently also a NamingContainer component.
您第一次尝试失败，因为它发现了复合材料本身，而不是面板组，但JS / AJAX又未能及时更新，因为不存在任何HTML元素 ID =myComponent的在生成的HTML输出。
Your first attempt failed because it found the composite itself instead of the panel group, but JS/ajax in turn failed to update because there doesn't exist any HTML element with id="myComponent" in the generated HTML output.
您第二次尝试成功了，因为它终于找到了真正的面板组（注：因为它也搜索中的所有其他 NamingContainer 成分;如果你这仍然失败使用＆LT; F：AJAX＆GT; 而不是＆LT; A4J：AJAX＆GT; ）
Your second attempt succeeded because it finally found the real panel group (note: because it also searched in all other NamingContainer components; this would still have failed if you've used <f:ajax> instead of <a4j:ajax>).
正确的方法来解决你的问题是没有使用＃{cc.attrs.id} 在JSF组件，但使用＃{CC .clientId} 一个普通的HTML元素。
The right way to fix your problem is not using #{cc.attrs.id} on a JSF component, but using #{cc.clientId} on a plain HTML element.
<span id="#{cc.clientId}">
（是的，使用＆LT;跨度＆GT; 或＆LT; DIV＆GT; 而不是＆LT; H：panelGroup中＆GT; 在＆LT; CC：实施＆GT; ）的
(yes, use a <span> or <div> instead of <h:panelGroup> inside the <cc:implementation>)
这样的JSF可以找到客户端ID组件（以生成正确的Ajax响应）和 JS可以发现，以更新基于正确的HTML元素被委托人身份证（HTML元素在Ajax响应）。
This way JSF can find the component by client ID (in order to generate the proper ajax response) and JS can find the HTML element by client ID (in order to update the right HTML element based on ajax response).
- JSF Ajax更新非JSF的东西
- <一个href="http://stackoverflow.com/questions/12615556/integrate-javascript-with-jsf-the-clean-way">Integrate在JavaScript的JSF复合组件，在干净的方式
- <一个href="http://stackoverflow.com/questions/8634156/how-to-reference-components-in-jsf-ajax-cannot-find-component-with-identifier/8644762#8644762">Cannot发现与前pression＆QUOT组成部分;富＆QUOT;酒吧＆QUOT;从＆QUOT参考; - ＆LT; F：AJAX＆GT;包含未知的ID＆QUOT;富＆QUOT;无法找到它的成分和QUOT的背景下，巴＆QUOT;
- JSF update with ajax non JSF things
- Integrate JavaScript in JSF composite component, the clean way
- Cannot find component with expression "foo" referenced from "bar" - <f:ajax> contains unknown id "foo" cannot locate it in context of component "bar"
这篇关于重新渲染阿贾克斯复合组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
