Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

General Questions

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Firefox 11 and multiple TinyMCE HTMLTextFields


Reply

8 Posts   1941 Views

Avatar
bartvanirsel

3 April 2012 at 9:21pm Community Member, 94 Posts

Hi,

I had a problem with multiple TinyMCE editors in the latest release of Firefox (11) not being displayed.
Silverstripe 3 wont have this problem, because TinyMCE will probably be the latest version.

For anyone who had the same problem, i found a temporarily solution for Silverstripe 2.4:

in your _config.php include a custom js file for the cms:

LeftAndMain::require_javascript('mysite/javascript/cms.js');

in this javacsript add the folowing:

Behaviour.register({
'#Form_EditForm' : {
initialize : function() {
this.observeMethod('PageLoaded', this.adminPageHandler);
this.adminPageHandler();
},
adminPageHandler : function() {

jQuery(window).load( function() {
jQuery(".mceEditor .mceLayout").each(function(i,ele){
jQuery("#"+ele.id).css('width',jQuery("#"+ele.id).width()+10)
});
});

}
}
});

Credits for the fix for older tinmce version in firefox 11 go to:
[url]http://stackoverflow.com/questions/9837629/tinymce-and-firefox-11[/url]

Hope this helps you.

Cheers,

Bart

Avatar
bartvanirsel

3 April 2012 at 9:43pm Community Member, 94 Posts

Above solution does not work after all, hope anyone else did manage to solve it :(

Avatar
bartvanirsel

4 April 2012 at 1:25am Community Member, 94 Posts

Kind of a lonely conversation with myself but the js needs to be the following to fix it:

Behaviour.register({
'#Form_EditForm' : {
initialize : function() {
this.observeMethod('PageLoaded', this.adminPageHandler);
this.adminPageHandler();
},
adminPageHandler : function() {

},
onload : function() {
jQuery(".mceEditor .mceLayout").each(function(i,ele){
jQuery("#"+ele.id).css('width',jQuery("#"+ele.id).width()+1)
});
}
}
});

cheers,

Bart

Avatar
MartinDoornekamp

4 April 2012 at 1:42am Community Member, 1 Post

Thanks Bart!

Avatar
edski

11 April 2012 at 1:12am Community Member, 12 Posts

Thanks, Bart - I've been looking out for a fix for this!

Has anyone resolved it for front end forms? We've got some sites with fairly complicated forms for end users and the same thing happens.

Avatar
edski

19 April 2012 at 1:33am Community Member, 12 Posts

We've managed to figure this out, albeit slightly crudely. In the ss template file add the following:

<script type="text/javascript">

      var FIREFOX = /Firefox/i.test(navigator.userAgent);
      if (FIREFOX) {
         jQuery(window).load( function() {
            
            jQuery(".mceEditor .mceLayout iframe").each(function(i,ele){
               jQuery(this).css('width',jQuery(this).width()+1);
            });
         });
      }
   </script>

Avatar
edski

19 April 2012 at 1:41am Community Member, 12 Posts

The issue is also happening when using a DataObjectManager popup with multiple editors.

Has anyone experienced the same issue?

Avatar
edski

19 April 2012 at 2:13am (Last edited: 19 April 2012 2:13am), Community Member, 12 Posts

This patch is crude, but it works! Essentially add a literal field to the DataObjectManager popup with the appropriate JS in it:

class MyDataObject extends DataObject{

$FFpatch = '<script type="text/javascript">var FIREFOX = /Firefox/i.test(navigator.userAgent);if (FIREFOX) {jQuery(window).load( function() {jQuery(".mceEditor .mceLayout iframe").each(function(i,ele){jQuery(this).css(\'width\',jQuery(this).width()+1);});});}</script>';

public function getCMSFields_forPopup()
{
...
return new FieldSet(
...
new LiteralField("FFPatch", $FFpatch)
);

}
}