Rich Text (HTML) Editor doesn't work in Chrome or Firefo

Hi Fil,



I am unable to reproduce this on Rollbase.com in Chrome and Firefox. Are you experiencing this when logged into Rollbase.com or a Private Cloud instance?



FYI, the HTML editor is a 3rd party open source product called openWYSIWYG. We do plan to use jQuery in the future.



Matt

Hmmm that's interesting. It's happening on rollbase.com as well as private cloud. I suspected initially it might be something missing from the private cloud install and so tested on rollbase.com as well but found the same problem. I've also now tested this on an XP install and it does the same thing (using Chrome and FF).



I can give you a log on to the rollbase.com app (via private email) that shows it but there is nothing special about the app. To verify it I simply picked the first text area field I came across and edited the field definition to tick the "Use Rich Text (HTML) Editor" box, saved and went back to the New page for the object and the editor doesn't appear for the field (with the javascript error appearing in the console).



F

Yes please provide the logs. Unfortunately I can't reproduce on my Win 2007 laptop but will try an a couple other machines.



Which version of FF are you using? I am using FireFox 8.0



Matt

Yes, Firefox 8.0 and also Firefox 9.0.



I found the problem. I am including jQuery in the apps (to help with skinning) but the openWYSIWYG code does something slightly naughty and uses $ as a function name to replace document.getElementById (see lines 2956-2958 of main.js) which is a problem because jQuery (and most other frameworks) use the $ as a shortcut to their framework. IE including jQuery is overriding the openWYSIWYG $ function and textarea on line 1158 is a jquery object not an element.



openWYSIWYG really shouldn't do that, but I can work around it by telling jQuery to not use $ - painful but possible.



Alternatively I could just not use the html editor :) - for now anyway.



Fil

Hi Fil,



Thanks for looking into this and pointing out the conflict. We are going to have to address this when we start using jQuery natively in the product so good to know.



Regards,

Matt

No prob.



I note there is a jquery plugin for openWYSIWYG (http://plugins.jquery.com/project/jqueryopenwysiwyg). Might be worth submitting a patch for openWYSIWYG to remove the conflict - if time allows I might do so later in the week.



The same problem came up in Drupal (which uses jQuery) some time ago and hence they also have a Drupal plugin for openWYSIWYG.



Fil

I'm experiencing the same exact issue in Chrome on any web page where I add jQuery and have a Rich Text HTML editor on screen. We really need to be able to use rich text fields so is it possible to correct this? If not, is there some kind of workaround I can use to get the fields to display with jQuery enabled?

Replacing this editor is on my short list for February. It is a sensitive enhancement because we need to do our best to ensure that existing Script and HTML components are not broken by any new editor (no guarantees but need to minimize the impact). I will do another post here once we have a jQuery compatible rich text editor replacement in place.



Thanks,

Matt

Thanks Matt!

The workaround is to add the following code just after you have included jquery:



jQuery.noConflict();



Then use jQuery() instead of $() throughout your code.



The other alternative is to wrap your code that uses jQuery in something like



(function($){....bunch_of_code...})(jQuery);



This effectively wraps your code in a function with a single parameter called $ and feeds jQuery in as the value for that parameter. This would allow you to use $() inside the ....bunch_of_code.... section.



Fil

Fil,



This works for me with the current editor until they can work in a jQuery compatible one. Thanks for the help!



Frank