TinyMCE not being able to preview an image

We have a timyMCE editor in a form. it is used to preview images we select from MediaBin. What we have is a browse button which opens a new window browsing mediabin and once an image is selected, the preview url will be written to the tinyMCE box and an image gets previewed. Everything works fine on firefox. However, if we use IE, the preview image gets disappeared when we click the browse button to open a new window to browse MediaBin. If we right click and select "show picture", the preview comes back. The preivew url we use in TinyMCE is something like this "<IMG src="http://ts01/iw-cc/command/iw.ecmconnector.mediabin_preview?preview_type=Preview_128x128&asset={2EC4B8F9-FD71-4F4F-8D1E-7D0299E822AB}&revision=5" border=0 editor_id="mce_editor_0">"

Please advise. Thanks.
The environment is Windows 2003, TS 6.7.1 sp1.

Find more posts tagged with

Comments

Migrateduser

We have a timyMCE editor in a form. it is used to preview images we select from MediaBin. What we have is a browse button which opens a new window browsing mediabin and once an image is selected, the preview url will be written to the tinyMCE box and an image gets previewed. Everything works fine on firefox. However, if we use IE, the preview image gets disappeared when we click the browse button to open a new window to browse MediaBin. If we right click and select "show picture", the preview comes back. The preivew url we use in TinyMCE is something like this "<IMG src="http://ts01/iw-cc/command/iw.ecmconnector.mediabin_preview?preview_type=Preview_128x128&asset={2EC4B8F9-FD71-4F4F-8D1E-7D0299E822AB}&revision=5" border=0 editor_id="mce_editor_0">"

Please advise. Thanks.
The environment is Windows 2003, TS 6.7.1 sp1.

does any image appear when previewing in TinyMCE on IE (media bin aside for a second)? there is a known issue in 6.7.1 sp1 with tinyMCE not allwoing images to preview in IE, only FireFox

here was my fix if its the same issue (support will tell you as well, so contact them before you break your DCT's, but if you have a dev box and want to try it)..

1) Make a backup copy of dc_editor.js in /httpd/webapps/content_center/datacapture

2) Edit dc_editor.js and replace the current var jsontext with:

var jsontext;
        var msie = ((navigator.appVersion.indexOf("MSIE")!= -1)&&!window.opera)? true : false;
        if (msie) {
         jsontext = "{debug: false,\
                mode: 'exact',\
                width: '100%',\
                cleanup: 'true',\
                textarea_trigger: 'tinymce',\
                theme: 'advanced',\
                init_instance_callback: 'parent.getDCFrame(self).IWTinyMCEEditor.instanceInit',\
                handle_event_callback: 'parent.getDCFrame(self).IWTinyMCEEditor.handleEvent',\
                plugins: 'table,iwlink,iwimg,searchreplace,iespell,paste,contextmenu,zoom,insertdatetime',\
                theme_advanced_toolbar_location: 'top',\
                theme_advanced_toolbar_align: 'left',\
                content_css : '/iw/tinymce/config/custom_content.css',\
                paste_create_paragraphs : false,\
                relative_urls: true,\
                paste_use_dialog : true,\
                extended_valid_elements: 'font',\
                theme_advanced_path_location: 'bottom',\
        ";
        } else {
         jsontext = "{debug: false,\
                mode: 'exact',\
                width: '100%',\
                cleanup: 'true',\
                textarea_trigger: 'tinymce',\
                theme: 'advanced',\
                init_instance_callback: 'parent.getDCFrame(self).IWTinyMCEEditor.instanceInit',\
                handle_event_callback: 'parent.getDCFrame(self).IWTinyMCEEditor.handleEvent',\
                plugins: 'table,iwlink,iwimg,searchreplace,iespell,paste,contextmenu,zoom,insertdatetime',\
                theme_advanced_toolbar_location: 'top',\
                theme_advanced_toolbar_align: 'left',\
                content_css : '/iw/tinymce/config/custom_content.css',\
                paste_create_paragraphs : false,\
                relative_urls: true,\
                paste_use_dialog : true,\
                extended_valid_elements: 'font',\
                document_base_url: '',\
                theme_advanced_path_location: 'bottom',\
        ";
        }

3) Run "iwreset -ui" and clear IE cache.

I worked with Support on an issue where tinyMCE only showed images in firefox, they gave a slightly modifed fix (step 2 was a tiny bit different and it basically only let IE work instead of FireFox) but I gave them my code change to support both browsers and they were updating their bug database.

polotoo

Thanks for reply. But I think I didn't explain it more clear. We did have images displayed in TinymCE field on IE after the images are selected. The images only disappear when we click on the a cgi-callout button which is gonna to open a new window for image selection.

Migrateduser

Thanks for reply. But I think I didn't explain it more clear. We did have images displayed in TinymCE field on IE after the images are selected. The images only disappear when we click on the a cgi-callout button which is gonna to open a new window for image selection.

well it might just be an IE quirk.. as I know there is also a bug where when you click a callout button, that has a URL defined, all the dropdown on tinyMCE get disabled (like styles, tables, fonts, etc..).. so this might just be another one.. you should call support and open ticket.

Antharix

The below link may throw some light

http://devnet.interwoven.com/forums_vb/showthread.php?t=23698&forumid=11&highlight=Tinymce

MattDWilliams

This is the solution from Support.

TinyMCE Images not previewing in IE

Please try the steps below:
1) Make a backup copy of dc_editor.js in httpd/webapps/content_center/datacapture.
2) Edit dc_editor.js and delete this line:
document_base_url: ''\
3) Prior to these lines:
// create the json of tinymce init settings
var jsontext = "{debug: false,\
mode: 'exact',\
width: '100%',\
...
Add the line below:
var msie = ((navigator.appVersion.indexOf("MSIE")!= -1)&&!window.opera)? true : false;
4) After the whole jsontext variable initialization:
// create the json of tinymce init settings
var jsontext = "{debug: false,\
mode: 'exact',\
width: '100%',\
...
theme_advanced_path_location: 'bottom',\
";
Add the lines below:
if (!msie) {
jsontext += "document_base_url: '',";
}
4) Run "iwreset -ui" and clear the IE cache.

Lex

This works for me to display images in TinyMCE, however it has a rather nasty side effect. If the TinyMCE text is later edited, all relative URLs have the text "/iw-cc/command/" added to the front. Sometimes it is added to the front multiple times so I end up with something like "/iw-cc/command/iw-cc/command/iw-cc/command/iw-cc/command/images/forestland.gif" which obviously breaks the image all over again. Is anyone else seeing this? It's really bizarre...

PaulW

Yeah I have the same issue. After applying the fix form the support article, the links have ""/iw-cc/command" prepended to the front of them. DOes anyone have any clue about this? ANyone resolved this issue?