16

Is it possible to update parts of my page that are not JSF components?

For example, can I update a plain HTML <div> or do I need to wrap that in a JSF component?

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
Nick Russler
  • 4,608
  • 6
  • 51
  • 88
  • possible duplicate of [JSF update primefaces tree children](http://stackoverflow.com/questions/13000870/jsf-update-primefaces-tree-children) – MartinStettner Oct 23 '12 at 08:12
  • @MartinStettner This is about updating plain HTML elements in JSF and not the primefaces tree component. – Nick Russler Oct 23 '12 at 15:28

3 Answers3

34

Is it possible to update parts of my page that are not JSF components?

No. The to-be-updated component has to be available by UIViewRoot#findComponent(), so that JSF can find them, invoke encodeAll() on it, capture the generated HTML output and pass back it in the ajax response so that JavaScript can update the HTML DOM tree with it. Plain HTML elements are not represented as real UIComponent instances in the JSF component tree, so JSF already cannot locate them in first place.

For example, can I update a plain HTML <div> or do I need to wrap that in a JSF component?

You need to wrap it in a JSF component like <h:panelGroup>. You can however just use <h:panelGroup layout="block"> to represent a real <div> in JSF. This way you don't need to wrap the <div> in another JSF component.

<h:panelGroup layout="block" id="foo">
    ...
</h:panelGroup>

Since JSF 2.2 you can use new passthrough elements feature with jsf:id attribute to declare HTML(5) elements as JSF components.

<... xmlns:jsf="http://xmlns.jcp.org/jsf">

<div jsf:id="foo">
    ...
</div>

<main jsf:id="bar">
    ...
</main>

<section jsf:id="baz">
    ...
</section>

They will render their output as-is, but under the covers be a concrete UIPanel instance.

There's however one corner case in case of composite components. You can use the following approach to have a HTML element which is updateable by ajax.

<cc:implementation>
    <span id="#{cc.clientId}">
        ...
    </span>
</cc:implementation>

The explanation that this approach works is because even though the composite component does not render itself to the HTML output, it is by itself available by UIViewRoot#findComponent().

See also:

Community
  • 1
  • 1
BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • what i don't understand isn't cc.clientId the id of the *whole* component ? I dont understand jsf that far, but wouldn't i update the whole "wrapping" component and not the div itself ? – Nick Russler Oct 23 '12 at 14:58
  • i my special case i wanted to update the child nodes of the primefaces tree, but i couldn't wrap the childs. I found a solution anyway using the primefaces expand method :) (http://stackoverflow.com/questions/13000870/jsf-update-primefaces-tree-children/13010709#13010709) – Nick Russler Oct 23 '12 at 15:13
  • This is unrelated to the current question. – BalusC Oct 23 '12 at 15:14
  • Yes i know only wanted to tell you that i still had my happy end – Nick Russler Oct 23 '12 at 15:26
  • Nice addition about the jsf 2.2 passthrough... Never thought of that. – Kukeltje Nov 22 '16 at 16:45
1

It seems that you can't.

to update something wrap it up in a 'updateable' component (in primeaces p:outputpanel) and update that one.

Addition: in your special case you can refresh the children of the p:tree that way: JSF update primefaces tree children

(haha always wanted to talk to me in third person)

Community
  • 1
  • 1
Nick Russler
  • 4,608
  • 6
  • 51
  • 88
-2

AFAIK you update components by their ID and since regular elements can have an ID it should be possible as long as you get the ID right ;-)

siebz0r
  • 18,867
  • 14
  • 64
  • 107
  • hm and when i have for example a div:
    the _right_ id isnt "something" ? Because when i add `` i get a `Cannot find component with identifier "something" referenced from "j_idt62:j_idt68:j_idt69".`     – Nick Russler Oct 22 '12 at 10:31
  • @NickRussler I guess it's not possible then :-) What are you trying to do? Maybe there are alternatives. – siebz0r Oct 22 '12 at 10:38
  • i want to update a treenode of a primefaces tree, without updating the whole tree – Nick Russler Oct 22 '12 at 10:55
  • @NickRussler You cannot update a single node of a tree. The ID of a node is not visible to the client. Check the generated HTML of the JSF page. – siebz0r Oct 22 '12 at 10:58
  • i can get the node id at the client, but if i pass that id for example to the PrimeFaces.ajax.AjaxRequest it does not update (while when i pass the tree id it updates)... So getting the id is not the problem – Nick Russler Oct 22 '12 at 11:07
  • i found a solution to my special problem: http://stackoverflow.com/questions/13000870/jsf-update-primefaces-tree-children/13010709#13010709 – Nick Russler Oct 22 '12 at 11:40