pe:coreMirror - 6.1 -- no ajax events?

Community Driven Extensions Project
bmoon
Posts: 24
Joined: 10 May 2016, 21:16

08 May 2017, 19:34

I'm using pimefaces 6.0.15 and extensions 6.1. The ajax events don't seem to work. I've tried: "change" and "blur" and neither seem to fire. Here's snippet of my code:

Code: Select all

<form>
    <div class="card">
            <pe:codeMirror id="codeMirror" mode="javascript" lineNumbers="true" 
                                           theme="eclipse" value="#{sessionBean.warpScript}" 
                                           matchBrackets="true" pollInterval="100" >
                  <p:ajax event="change" listener='#{sessionBean.fixMe()}' process="codeMirror"/>
                  <p:ajax event="blur" listener='#{sessionBean.fixMe()}' process="codeMirror"/>
             </pe:codeMirror>
             <p:commandButton value="Execute" action="#{sessionBean.runWarpScript()}"/>
    </div>
</form>
I've tried adding process="@this" to the ajax event handlers. I've tried then without listeners. I've tried them as above with process="id of codeMirror" and I've also tried to add a "valueChangeListener" to the codeMirror component. I also tried setting a specific polling interval. I've tested the code on FireFox and Safari with the same results. I've also tried adding an "f:ajax" as above. None of these combinations seems to enable events :(

In my browser, when I turn on debug, it says that the script has disabled console output:

"The Web Console logging API (console.log, console.info, console.warn, console.error) has been disabled by a script on this page."

So I can't gather much more information about any errors or anything at the javascript level.

Melloware
Posts: 3716
Joined: 22 Apr 2013, 15:48

08 May 2017, 19:40

OK a few issues...

1. PF 6.1.0 is only designed to work with PF 6.1 and not with 6.0.15 (however it may still work with 6.0.15)

2. I think I fixed this issue already here: https://github.com/primefaces-extension ... issues/451

3. I put a SNAPSHOT JAR in that link for you to try. Can you let me know if it works?
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

bmoon
Posts: 24
Joined: 10 May 2016, 21:16

08 May 2017, 20:13

No joy. Just tried it out. I'll update PF to 6.1 and switch back to the main PFE 6.1 release as well and see if that clears it up. I actually didn't realize that PF6.1 was out.

Melloware
Posts: 3716
Joined: 22 Apr 2013, 15:48

08 May 2017, 20:16

No problem and then after that try my SNAPSHOT jar to see if it is fixes it. if not its possible I need to make another fix. We drastically updated CodeMirror between 6.0. and 6.1 so I clearly missed a few things. Just let me know...
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

bmoon
Posts: 24
Joined: 10 May 2016, 21:16

08 May 2017, 20:36

The events are fixed, however the editor is actually gone. Instead of having codeMirror's frame, I have a textArea shown. Here's my xhtml, its simple enough. I took away all the extra stuff. It is inside of a form.

Code: Select all

......
                            <pe:codeMirror id="editor" lineNumbers="true" 
                                           theme="eclipse" value="#{sessionBean.warpScript}" 
                                           matchBrackets="true" pollInterval="100" >
                                <p:ajax event="change" listener="#{sessionBean.fixMe()}"/>
                            </pe:codeMirror>
......
This is what gets rendered to the browser:

Code: Select all

<textarea id="contentForm:editor" name="contentForm:editor" onchange="PrimeFaces.ab({s:&quot;contentForm:editor&quot;,e:&quot;change&quot;,p:&quot;contentForm:editor&quot;});">asdfasdf</textarea>
<script id="contentForm:editor_s" type="text/javascript">$(function(){PrimeFaces.cw("ExtCodeMirror","widget_contentForm_editor",{id:"contentForm:editor",theme:"eclipse",lineNumbers:true,readOnly:false,matchBrackets:true,pollInterval:100,behaviors:{change:function(ext,event) {PrimeFaces.ab({s:"contentForm:editor",e:"change",p:"contentForm:editor"},ext);}}});});</script>
I tried with both the mainline code and the snapshot with the same results? I'm also using Ultima 1.07 if that makes a difference? Oh and I use OmniFaces 2.5.1.

bmoon
Posts: 24
Joined: 10 May 2016, 21:16

08 May 2017, 20:43

My bad. I didn't actually switch to the snapshot when I thought. Forgot to flush old build :oops:

With the snapshot jar it works and renders as expected. Thanks a bunch for the help!

Melloware
Posts: 3716
Joined: 22 Apr 2013, 15:48

08 May 2017, 20:45

Nice!!! I will be doing a 6.1.1 Release with these fixes in it soon.
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

bmoon
Posts: 24
Joined: 10 May 2016, 21:16

08 May 2017, 21:03

Sorry, not so fast. I now have a different problem. When the form gets processed it does not save the current content of the editor but rather seems to have the "old" information in the form. Events are working, it renders correctly, but when the "change" event fires, it reads the old value from the server and then sets the value to the old value again.

In other words on a process form, it calls the "getter" and then the "setter" method rather than the "setter" method and then the "getter" method. Hope that makes sense how I explained it.

Melloware
Posts: 3716
Joined: 22 Apr 2013, 15:48

08 May 2017, 21:13

Can you paste the XHTML snippet here so I can try it myself?
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

bmoon
Posts: 24
Joined: 10 May 2016, 21:16

08 May 2017, 21:44

I think I've narrowed it down to being my fault again. I'm trying to do a bit more rigorous testing before I send you off on a tangent this time. I think what is actually going on is that my "getter" is being called before my "setter" as I observed, however, the *new* value is sent via the setter, so it should be OK. The getter is not being called from the browser side, its just part of the component processing server side, so it seems to be OK as well.

When I trace the browser session from my client, I can see only the single "post" when the change event fires. I had added a bunch of server side debug to trace what was going on earlier, including logs when my session bean's getter and setter methods are called. It appeared that the browser was calling them, but it was just the render engine.

Post Reply

Return to “Extensions”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 5 guests