WYSIWYG editor bug with Fabrik 3.1RC2

[jfquestiaux]

The WYSIWYG editor has some issues with the latest Fabrik version:

• The Word count does not work: it shows the limit - 1 (like if the limit is 500 words, it shows 499 with an empty window) and does not change when you add text
• A "not empty" validation always fails, even if there is something in the textarea

I tested this with JCE, but if I switch to tinyMCE, I can't even write in the window.

If I turn the WYSIWYG editor, everything wors fine: word count (starting at 500) and validation.

Tested on FF, Joomla 3.1.6 and Fabrik 3.1RC2.

 

[rob]

word count seems to work for me 0n your site (once I had set the global editor to tinyMCE)
The issue with the validation was that the blur event is assigned to the textarea and not the editor. I've altered the code so that the editor now forwards its internal blur events to the textarea, thus firing the the ajax validation.

 

[jfquestiaux]

Well the word count still does not work with J 3.2 and Fabrik 3.1 RC2:

With JCE the word count does not work "in real time". It seems to be correct but only after you saved the form.
But, In IE 9, I can't even write in the textarea!

I tried to switch to TinyMCE and it's worse: with FF, I can't write in the textarea at all. If I edit an existing record, the previous entered text does not show, even if the editor is displaying the correct word count.

 

[rob]

still working correctly for me here - here's a video of the elements in use:
http://screencast.com/t/Si4RFwP1

 

[troester]

My tests:
without any validation
JCE with character/word count is working in IE (10+9) and Chrome, not working in FF.
If there's a notempty validation and ajax validate it is not working in Chrome, too

it is still working in IE
but beside counting IE is showing the not empty error message (although it's definively NOT empty)
error message is also shown in FF (without counting)
So it seems the count triggers/conflicts with ajax validation (which is not triggered for the textarea in FF and Chrome, fields are validated)
Chrome
event.returnValue is deprecated. Please use the standard event.preventDefault() instead. jquery.min.js:5
'KeyboardEvent.keyLocation'' is deprecated. Please use 'KeyboardEvent.location' instead. tiny_mce.js?version=2332:1
Uncaught TypeError: Cannot call method 'getElement' of null

FF
getAttributeNode() sollte nicht mehr verwendet werden. Verwenden Sie stattdessen getAttribute().

...ibuteNode("value"))&&b.specified?a.value:a.get("text")}};b=null;if(document.crea...
mootools-core.js (Zeile 108)
SyntaxError: Using //@ to indicate source map URL pragmas is deprecated. Use //# instead
/*! jQuery v1.10.2 | (c) 2005, 2013 jQuery Foundation, Inc. | jquery.org/licens
jquery.min.js (Zeile 1)
getPreventDefault() sollte nicht mehr verwendet werden. Verwenden Sie stattdessen defaultPrevented.
...o;C=new a(z,s.getParent(z.parentNode,s.isBlock)||u);while(q=C[B?"prev":"next"]()...
tiny_m...on=2332 (Zeile 1)
Object[]
window-min.js (Zeile 1)

 

[jfquestiaux]

That's quite a test! I guess it's not clear where the deprecated code is coming from: JCE, Joomla or Fabrik?

 

[rob]

can people ping me with the urls of their test sites please? Obviously there's something different between our set ups

 

[troester]

There seem to be strange caching or JS loading issues:
see MySites (3.1rc2 testsite)
with Chrome:
clear browser cache
log in
edit record in Miet-Objekte ->word count is not working
Save, edit again (any record) ->word count is working

Other issue:
a failed ajax validation shows element in red but doesn't display the element's error message (nor in tip nor directly in form);
after Save the error message is displayed below the element as expected

 

[rob]

well Joomla's default TinyMce editor is working for me on your site, but not jce (which seems to us an older version of tinymce to the standard editor) No idea why that would be - the keys events are simply not being fired by jce.

a failed ajax validation shows element in red but doesn't display the element's error message (nor in tip nor directly in form);
after Save the error message is displayed below the element as expected

It should show it in the tip - the problem with injecting errors into the dom with ajax validation was that the page content continually shifted up and down as the messages appeared making it hard to select the next element with a mouse.

Now there was a bug (perhaps due to the 3.2 update) where the error message wasn't added to the tip text - I've fixed that today though and will commit soon

 

[jfquestiaux]

About Element's error message not showing:

I agree that the AJAX behavior shifting fields up and down was confusing (I beleive I am the one who asked you to remedy to that), but in the case of multi page forms, could we have a compromise?

By their nature, multi page forms have an AJAX validation, BUT this one is triggered when the form is submitted. If there is an error, the page is loaded again, so in that case it's not a problem to have the error message below the field.
I guess you have a method to know if the form is multipage, so you could knwo whether or not allow error message in the form.
It would be really helpful in some cases.

 

[jfquestiaux]

And for the editor, there is some cache issue: tested with IE10 (with word count off, but a nonempty validation, multipage form), I copy a text, save the form OK.
When editing the form, the text does not show (but it's in the database), I can't write in the text window and I can't submit the form (but I can navigate though the pages).
Very weird.

With FF, the same form/record work fine.

If it is a JCE bug, what should I tell them?