pe:layout in partial page refresh

Community Driven Extensions Project
texess
Posts: 95
Joined: 03 Jun 2012, 14:04

22 Jun 2012, 09:52

Hi,

I have this scenario on my page:

Code: Select all

<p:outputPanel id="content">
  <ui:include src="#{myBean.location}"/>
</p:outputPanel>
I.e. depending on some user action, the location is set and the content is refreshed. In one case, the included resource looks like:

Code: Select all

<ui:composition....>
  <pe:layout ...>

  </pe:layout ...>

</ui:composition>
When I use ajax partial page refresh to update the "content" outputPanel the layout is not correctly displayed and it is not usable. I.e. east and center are displayed among each other and I cannot click on the content.

However, when I refresh the page, the layout looks correct. Even though, when I do not use ajax for reloading content (ajax = "false"), everything works good.

So, obviously, using pe:layout in a partial page refresh is not a good idea? I think there are many cases where pages have a content with a further layout.

Regards,

Tex
PF 3.4.1
PE 0.6.0

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

22 Jun 2012, 10:12

Hi,

Why not a good idea? We use it for partial AJAX updates. No problem. See here an example http://fractalsoft.net/primeext-showcas ... Layout.jsf

Make sure you don't use full page layout (<pe:layout fullPage="false" ...>).
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

texess
Posts: 95
Joined: 03 Jun 2012, 14:04

22 Jun 2012, 12:04

Hi Oleg,

hm, when I change the fullPage to false I get the message that the height is not defined. Is it a problem that the outputPanel is within another <p:layoutUnit position="center">?

But: FullPage = "true" works good, when I do a full request and not a partial page refresh.

Regards,

Tex
PF 3.4.1
PE 0.6.0

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

22 Jun 2012, 13:51

fullPage = true is only for FULL page layouts! Such layouts span the entire visible area and are normally placed direct after h:body tag.

Code: Select all

<h:body>
    <pe:layout fullPage="true" ...>
        ...
    </pe:layout>
</h:body>
So, you layout is an element layout. Please set fullPage="false". Furthermore, why do you use p:layoutUnit from PrimeFaces and pe:layout / pe:layoutPane together? It's not possible! Use either PrimeFaces layout tags or layout tags from PF Extensions. And the last rule: center pane should be always present in any layout (p:layout or pe:layout). You can't have a layout without a center pane / unit.
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

texess
Posts: 95
Joined: 03 Jun 2012, 14:04

22 Jun 2012, 14:41

Hi,

ok thanks. Did all the changes. Now I have this kind of site:

Code: Select all

<html ..>
<h:body>
<pe:layout fullPage="true" ...>
<pe:layoutPane ...>
...
</pe:layoutPane>

<pe:layoutPane position="center"...>
  <p:outputPanel id="content">
  <pe:layout fullPage="false">
     ...
  </pe:layout>
  </p:outputPanel>
</pe:layoutPane>

..
But I still get the error that there is no height defined. Obviously, the outputPanel is the reason.

Tex
PF 3.4.1
PE 0.6.0

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

22 Jun 2012, 15:22

This is not allowed

Code: Select all

<pe:layoutPane position="center"...>
  <p:outputPanel id="content">
  <pe:layout fullPage="false">
     ...
  </pe:layout>
  </p:outputPanel>
</pe:layoutPane>
In PF Extensions you don't need pe:layout for nested layout. Use pe:layoutPane only. You probably mix PrimeFaces layout logic with PF Extensions. This is valid:

Code: Select all

<pe:layoutPane position="center"...>
    <pe:layoutPane position="center">
    ...
    </pe:layoutPane >
    <pe:layoutPane position="west">
    ...
    </pe:layoutPane >
     ...
</pe:layoutPane>
But it would not help in your case. Because the current layout can't have other elements between layout panes (your p:outputPanel e.g.) and nested layout is not updatable (you can't change nested layouts on postback).

The new layout implementation will support all features: http://code.google.com/p/primefaces-ext ... ail?id=198 You should wait until it's ready-to-use. Because I'm writing the PrimeFaces Cookbook I can't get it implemented soon. Next month probably in 0.6.0-SNAPSHOT.
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

texess
Posts: 95
Joined: 03 Jun 2012, 14:04

23 Jun 2012, 08:16

Hi,

this is great news! So I'll wait..

Thanks

Tex
PF 3.4.1
PE 0.6.0

texess
Posts: 95
Joined: 03 Jun 2012, 14:04

03 Sep 2012, 12:09

Any news about version 0.6 for PE?

Tex
PF 3.4.1
PE 0.6.0

texess
Posts: 95
Joined: 03 Jun 2012, 14:04

04 Sep 2012, 11:45

Or is there a snapshot that already supports this feature? This would be really great as it would solve a lot of my problems.

Regards,

Tex
PF 3.4.1
PE 0.6.0

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

04 Sep 2012, 12:31

Hi,

No, SNAPSHOT doesn't have this feature yet. Please wait a little bit, I'm overloaded with tasks after my vacation at the moment. We will release in September in any case.
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

Post Reply

Return to “Extensions”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 4 guests