Question

I’m using django-tinymce together with the no grappelli branch of django-filebrowser running django 1.2.

I use the tinymce HTMLField model definition for the model field that I would like to have WYSIWYG.

I’ve added the correct javascript to my AdminModel, and the filebrowser works great, adding the image to the textarea with no problem, however, when I save, the textarea does not update (it looks like tinnymce doesn’t touch it when it should). When I turn off the filebrowser plugin, everything works fine, so there must be some conflict with it and the TinyMCE onSubmit functionality.

I’ve been messing with it for while and just can’t get anywhere – all of these pieces are pretty new to me, so even some ideas of what to mess with would be helpful.

Thanks in advance.

edit: Added bonus info – the default mode in the config for ‘mode’ was ‘textareas’. When I remove that, everything saves correctly. Sadly, this also removes the image button that I’m doing all of this to have…

update

Here is the TinyMCE configuration I was using (the one included with django-filebrowser – this is broken):

tinyMCE.init({
  mode: "textareas", 
  theme: "advanced",
  language: "en",
  skin: "o2k7",
  browsers: "gecko",
  dialog_type: "modal",
  object_resizing: true,
  cleanup_on_startup: true,
  forced_root_block: "p",
  remove_trailing_nbsp: true,
  theme_advanced_toolbar_location: "top",
  theme_advanced_toolbar_align: "left",
  theme_advanced_statusbar_location: "none",
  theme_advanced_buttons1: "formatselect,bold,italic,underline,bullist,numlist,undo,redo,link,unlink,image,code,fullscreen,pasteword,media,charmap",
  theme_advanced_buttons2: "",
  theme_advanced_buttons3: "",
  theme_advanced_path: false,
  theme_advanced_blockformats: "p,h2,h3,h4,h5,h6",
  width: '700',
  height: '200',
  plugins: "advimage,advlink,fullscreen,visualchars,paste,media,template,searchreplace",
  advimage_styles: "Linksbündig neben Text=img_left;Rechtsbündig neben Text=img_right;Eigener Block=img_block",
  advlink_styles: "internal (sehmaschine.net)=internal;external (link to an external site)=external",
  advimage_update_dimensions_onchange: true,
  file_browser_callback: "CustomFileBrowser",
  relative_urls: false,
  valid_elements : "" +
  "-p," + 
  "a[href|target=_blank|class]," +
  "-strong/-b," +
  "-em/-i," +
  "-u," + 
  "-ol," + 
  "-ul," + 
  "-li," + 
  "br," + 
  "img[class|src|alt=|width|height]," + 
  "-h2,-h3,-h4," + 
  "-pre," +
  "-code," + 
  "-div",
  extended_valid_elements: "" + 
  "a[name|class|href|target|title|onclick]," + 
     img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name]," + 
  "br[clearfix]," + 
  "-p[class<clearfix?summary?code]," + 
  "h2[class<clearfix],h3[class<clearfix],h4[class<clearfix]," + 
  "ul[class<clearfix],ol[class<clearfix]," + 
  "div[class],"
});

This was one of two problems I was having – going to post an answer below as well.

Answer 1

The issue was actually two-fold. The first problem was the included default TinyMCE configuration that came with django-filebrowser-no-grappelli (above, in the question). I’m not sure what was wrong with it, but it prevented the actual form fields from being updated when the submit button was pushed.

When I used a custom configuration for TinyMCE, form field saving worked correctly, but the filebrowsing was broken. This was because if django-tinymce sees ‘filebrowser’ in the installed apps list, it overrides the file_browser_callback and sets it to ‘djangoFileBrowser’, so even when I correctly set it to ‘CustomFileBrowser’ in my own config. The solution was to explicitly tell it not to set that value. I added the follwing to my settings.py:

TINYMCE_DEFAULT_CONFIG = {
    'theme': 'advanced',
    'theme_advanced_toolbar_location': "top",
    'theme_advanced_toolbar_align': "left",
    'skin': "o2k7",
    "file_browser_callback" : "CustomFileBrowser",
}
TINYMCE_FILEBROWSER = False

And everything seems to be working fine. This issue seems to be fairly unique to my combination of versions.