Primefaces ajax callback with parameter to javascript

Question

I am struggling to send a Primefaces bean property to javascript directly in order to open a new page and write the content of the bean property into the new page.

I am using Primefaces 4.0.

I have a command button like this:

 <p:commandButton id="buttonId" update="buttonId, otherComponentId"
    value="press me" process="@this" actionListener="#{homeController.myMethod}"
    oncomplete="handleComplete(xhr, status, args)">
 </p:commandButton>

In handleComplete javascript function args is undefined, but not xhr and status. javascript function definition:

function handleComplete(xhr, status, args){
    var w = window.open();
    w.document.open();
    alert(xhr.responseText.substring(100));
    alert(status);
    alert(args);
    var d = '<head></head><body>'+ args.firstParam +'<body>';
    w.document.write(d);
    w.document.close();
}

first alert it's giving me the page, the second one parse error, and the error is: Uncaught TypeError: Cannot read property 'firstParam' of undefined

I want to pass in the args a string like this:

public String MyMethod() {
    RequestContext context = RequestContext.getCurrentInstance();  
    context.addCallbackParam("firstParam", "my string");
      return "";
}

and access it in javascript with args.firstParam .

the method is called, (I have some printscreens that work.)

I have to try this way and not to set the text into a

<h:outputText id="myText" escape="false" rendered="true"
            value="#{homeController.property}" />

and then get innerHTML of this element because what I will get with innerHTML will not be the same as the string variable in the bean. This method works but not as I would like. I am wondering why the args object is undefined or how else could I get the bean property manageable from javascript. Thank you.

score 6 · Accepted Answer · edited May 23 '17 at 10:31

6

First thing you should make sure that your method is called. Put some logging or debug your method if it's called correctly.

If not you might want to add the process attribute into the button, and set the process into @this.

If in this stage your method is called, then you have a validation error in your page.

And I would call my methods in actionListener not in action, and put the () in the end. Differences between action and actionListener

Try the following

<p:commandButton id="buttonId"
 value="press me"  actionListener="#{homeController.myMethod()}"
 process="@this"
 oncomplete="handleComplete(xhr, status, args)">
</p:commandButton>

Since your error is "firstParam" is undefined and not the "args" is undefined, you might want to make sure that your firstParam value is not null !.

edited May 23 '17 at 10:31

Community

1
1

answered Dec 12 '13 at 14:47

Hatem Alimam

9,968
4
44
56

Thanks for help and for quick reply. this is the error in the javascript function Uncaught TypeError: Cannot read property 'firstParam' of undefined . I will edit the post right away. – Mihai Serban Dec 12 '13 at 14:54
I have updated my answer with one more suggestion in the end... let me know what you have... @MihaiSerban – Hatem Alimam Dec 12 '13 at 15:13
You are right, thanks. if I add `context.addCallbackParam("firstParam", "hello world");` to the parameter it works, but if I add my string it is null and it gives an error. My string it's actually a static page.. there might be some size restrictions? because My string it's printed out, it's not null, but it's quite large. – Mihai Serban Dec 12 '13 at 15:26
But I don't understand why you want to return a static page in a string and append it! What I would do is, do a static page and show it if it's completely static ! If it's not completely static, I would do the static parts into a page, and return a JSON, and fill these JSON into the page. Again I wouldn't do the window thing, since most of the browsers are going to block it. I would use Dialog with iframe="true". @MihaiSerban – Hatem Alimam Dec 12 '13 at 15:32
this static page it's generated in the business logic based on multiple factors. It's a rendered template which has to be created also from a standalone app. It is not in my authority to change this. the thing is that if I use a dialog the doctype and head and html elements disappear and the static page displayed on the server is not identical to the one generated locally and displayed in browser. .. I could manipulate the string and add the head and body tags and other missing parts... but if something will change in the file in time it won't work. – Mihai Serban Dec 12 '13 at 15:39
I tried this solution hoping that this way the page will have exactly the same content as the locally generated one... It is not practical to write the string to an xhtml file on the server and then just make it available through a link, because there will be a lot of pages written to the server disk space... – Mihai Serban Dec 12 '13 at 15:48
Well in this case I don't know what to say, if you even don't want to use inputText as an alternative ... Although it's a fare Idea to have inputText with dispaly: none, and in your JS you read the content and append it. @MihaiSerban – Hatem Alimam Dec 12 '13 at 16:35
I used your idea with hidden inputText and it comply to the rules of strict xhtml code. Now it works better (I don't have that many rendering issues). I am still unable to understand why the same static page has different content when it's opened from the web context from when it's open locally from the disk. Your answer helped me fix my issues and since I can't vote it up I will mark it as correct. Thanks for your help. – Mihai Serban Dec 16 '13 at 12:02
If it's "displaying" differently (hidden content, misplaced content), then I recommend to inspect your css, links or embed ones. and compare between the local version and the remote version. @MihaiSerban – Hatem Alimam Dec 16 '13 at 12:21

Primefaces ajax callback with parameter to javascript

1 Answers1

Linked