4

I have a primefaces component like this:

<p:panel styleClass="errorsPanelClass" id="errorsPanel" header="Messages" toggleable="true" effect="drop" toggleSpeed="0" closeSpeed="0" widgetVar="errorsPanelWidget">

and i'm trying to get the component in javascript context and update it.

I already tried with:

function getWidgetVarById(id) {
   for (var propertyName in PrimeFaces.widgets) {
     if (PrimeFaces.widgets[propertyName].id === id) {
       return PrimeFaces.widgets[propertyName];
     }
   }
}

or

How to find a widgetVar?

or

Get widgetVar with JavaScript or check/uncheck all other PrimeFaces checkboxes

It will be great if I'll find a solution to take the widgetVar by class, but any other solutions are welcomed.

I also tried:

function getWidgetVarById() {
    for ( var propertyName in PrimeFaces.widgets) {
        alert(PrimeFaces.widgets[propertyName].id);
    }
}

but I get an javascript error "'PrimeFaces.widgets.length' is null or not an object"

Any ideas?

Community
  • 1
  • 1
Aditzu
  • 696
  • 1
  • 14
  • 25
  • What if (just for testing) you do a `PF('errorsPanelWidget')`? Since that should work and if it does, it is weird since internally it does a `PrimeFaces.widgets[widgetVar]` which would contradict 'null' or not an object for the length. – Kukeltje Feb 19 '15 at 15:17
  • I made alert(PF('errorsPanelWidget')); and I get "Object expected" error :( – Aditzu Feb 19 '15 at 15:22
  • Then you have a completely different problem. What version of PF are you using? And what does an `alert(PrimeFaces.widgets)` do? Post a minimal but fully valid xhtml example – Kukeltje Feb 19 '15 at 15:26
  • I'm using Primefaces 3.5 – Aditzu Feb 19 '15 at 15:29
  • 1
    If it matters this component is in a custom component which is used in another xhtml file. I check and is rendered correctly – Aditzu Feb 19 '15 at 15:32
  • The solutions you found are **not** for 3.5. These are only valid for newer versions. In 3.5 the widgets are added to the 'window' object and not stored somewhere else. This means that the widgetVar is already directly a variable u can use. There is no mapping with the id. Easiest is then to use a convention that you name your widgetVar like your id but with a postfix e.g. id_widget. You **could** (advise against it) leave the widgetVar out and then the widget is idententical to the id (this can cause classhes in cases, that is why PF dropped this convention). – Kukeltje Feb 19 '15 at 15:54
  • I tried alert(window.errorsPanelWidget); and i get "Undefined" message :-s – Aditzu Feb 19 '15 at 16:04
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/71274/discussion-between-kukeltje-and-aditzu). – Kukeltje Feb 19 '15 at 16:06

1 Answers1

10

There is not mapping between the id and a widgetVar for PrimeFaces 3.5. In 3.5 the widgets are added to the 'window' object and not stored somewhere else. This means that the widgetVar is already directly a variable u can use. 

<p:panel id="errorsPanel" widgetVar="errorsPanelWidget">

3.5/4.0: (in 4.0 this still works but is deprecated in favour of the PF('..') way) errorsPanelWidget.close()

5.0 and up: PF('errorsPanelWidget').close() (unless you configure the legacy mode after which it will behave like 3.5/4.0)

Easiest is then to use a convention that you name your widgetVar like your id but with a postfix e.g. id_widget. You could (advise against it) leave the widgetVar out and then the widget is idententical to the id (this can cause classhes in cases, that is why PF dropped this convention).

And you could still check if in 3.5 the widgetVar value is in one way or another added to the outer html element of the widget. You could then retrieve it with some jquery. Personally, I used the 'convention' way in previous PF versions (appending 'Widget' to the value that is also in the id and putting that in the widgetVar attribute)

And if with 'updating' the widget, you mean updating the content of the widget, you can't. There is no refresh() kind of method that does this. What you could do is send the id(!) to the server and execute an update(..) there via the requestContext like this

RequestContext context = RequestContext.getCurrentInstance();
context.update("errorsPanel");

But it might be even better to just to this the moment you update the list serverside. So it might be that you've fallen into the XY trap.

But if it is really needed, here is an example that works, using the PrimeFaces extensions remoteCommand since that is the easiest way)

xhtml:

<pe:remoteCommand id="refreshWidgetCommand" name="refreshWidget" process="@this" actionListener="#{updateWidgetController.refresh}">  
    <pe:methodSignature parameters="java.lang.String"/>  
    <pe:methodParam name="id"/>  
</pe:remoteCommand>

Bean:

@ManagedBean  
@RequestScoped  
public class UpdateWidgetController {  

    public void refresh(final String id) {  

        RequestContext context = RequestContext.getCurrentInstance();
        context.update(id);
    }
}

calling refreshWidget('errrosPanel'); will achieve what you want.

Don't wan't to use PFE (or can't use this due to version incompatibilities), you can achieve the same with PF remoteCommand But the specific example for 3.5 might differ a little

Kukeltje
  • 12,223
  • 4
  • 24
  • 47
  • Thanks a lot! Now it seems to work but what i can update this object now or re-render it? – Aditzu Feb 19 '15 at 16:32
  • Lol errorsPanelWidget.close() is working but when i call errorsPanelWidget.refresh() i get an error "id is null or not an object" :-s – Aditzu Feb 19 '15 at 16:36
  • The PF() shortcut is available also in 4.0 it's not 5.0 and up :) – Hatem Alimam Feb 19 '15 at 17:43
  • Yep, correct, but the 'old' version still worked and was just deprecated. In 5.0 you had to switch and in a 5.0.x and 5.1 a legacy switch was added – Kukeltje Feb 19 '15 at 19:57
  • Every time I accept an answer when it solves my problem. The title quiestion is "Get primefaces widgetVar in javascript and update it" and until now only the first part I did it. Don't understand me wrong but if I accept your answer it means my problem is solved which is not true. – Aditzu Feb 20 '15 at 07:49
  • So you actually meant to update the content inside the panel? Not updating the visibility (hiding/showing). That is not supported via a the javascript api of widgets. I'll add that to my answer, so it becomes 'acceptable' ;-). I've never seen this requirement, so maybe you've fallen in the [XY trap](http://meta.stackexchange.com/questions/66377/what-is-the-xy-problem) – Kukeltje Feb 20 '15 at 09:24
  • After all I find an easy solution named which does exactly what I want. It has an attribute autoUpdate which makes my life easier. I accepted you answer without checking because I already solved my problem. Thank you! – Aditzu Feb 26 '15 at 08:33