• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2071
  • Last Modified:

Tinymce, Jquery and AJAX submit in IE6

Hello Experts,

After a lot of pain and experimentation I have finally managed to get Tinymce to update to submit via the Jquery Form plugin. However, for some reason it will only work in Firefox and in IE6 it just fails throwing up "Unspecified Error". I've gone through everything I can think of to get it working, but nothing seems to work.

Help? My code is attached.

500 points as ever :-)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"/>
 
 
<head>
  <title>Edit article</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"/>
 
 
      
		     
 <script language="javascript" type="text/javascript" src="tinymce3/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
 
	tinyMCE.init({
		mode : "exact",
		elements : "articlebody",
		 theme: "advanced",
		 skin : "o2k7",
  plugins : "safari,paste,pagebreak,style,layer,table,save,advhr,advimage,advlink,insertdatetime,preview,media,searchreplace,contextmenu,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,imgmap,liststyle",
 
		// Theme options
theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontsizeselect",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,liststyle,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,imgmap",
theme_advanced_buttons3 : "tablecontrols,|,insertbox,hr,removeformat,visualaid,|,sub,sup,|,charmap,advhr,|,ltr,rtl",
theme_advanced_buttons4 : "forecolor,backcolor,|,styleprops,spellchecker,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,blockquote,pagebreak,|,insertdate,inserttime,|,newdocument,cleanup,code,preview,|,fullscreen",
theme_advanced_styles : "-- Headings _______________----=_;Reverse Blue=reverse_blue;-- Boxes _______________----=_;Bluebox Full=bluebox_full;Bluebox ½Left=bluebox_half_left;Bluebox ¼Left=bluebox_quarter_left;Bluebox ½Right=bluebox_half_right;Bluebox ¼Right=bluebox_quarter_right;Greenbox Full=greenbox_full;Greenbox ½Left=greenbox_half_left;Greenbox ¼Left=greenbox_quarter_left;Greenbox ½Right=greenbox_half_right;Greenbox ¼Right=greenbox_quarter_right;Greybox Full=greybox_full;Greybox ½Left=greybox_half_left;Greybox ¼Left=greybox_quarter_left;Greybox ½Right=greybox_half_right;Greybox ¼Right=greybox_quarter_right;Whitebox Full=whitebox_full;Whitebox ½Left=whitebox_half_left;Whitebox ¼Left=whitebox_quarter_left;Whitebox ½Right=whitebox_half_right;Whitebox ¼Right=whitebox_quarter_right;Yellowbox Full=yellowbox_full;Yellowbox ½Left=yellowbox_half_left;Yellowbox ¼Left=yellowbox_quarter_left;Yellowbox ½Right=yellowbox_half_right;Yellowbox ¼Right=yellowbox_quarter_right;-- Float ______________________________=_;Float Left=floatLeft;Float Right=floatRight;--Predefined_______________=_;Intro Text 1=introText1;Intro Text 2=introText2",
 
 
 
  spellchecker_languages: "+English=en,French=fr",
  theme_advanced_toolbar_location: "top",
  theme_advanced_toolbar_align: "left",
  content_css : "css/richeditorstyles.css",
  extended_valid_elements : "div[*],-p[id|style|dir|class],img[usemap|class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],map[id|name],area[shape|alt|coords|href|target]",
 
		external_link_list_url : "example_data/example_link_list.js",
		external_image_list_url : "example_data/example_image_list.js",
		flash_external_list_url : "example_data/example_flash_list.js",
		file_browser_callback : "mcFileManager.filebrowserCallBack",
		paste_create_paragraphs : false,
	  paste_create_linebreaks : false,
	  paste_use_dialog : false,
	  paste_auto_cleanup_on_paste : true,
	  paste_convert_middot_lists : false,
	  paste_unindented_list_class : "unindentedList",
	  paste_convert_headers_to_strong : true,
	  paste_insert_word_content_callback : "convertWord",
		theme_advanced_resize_horizontal : false,
		theme_advanced_resizing : true,
		apply_source_formatting : true,
		width : "100%",
		height : "380",
		file_browser_callback : "FileBrowser", // This is required
		setup : function(ed) {
        // Add a custom button
        // Add a custom button
        ed.addButton('insertbox', {
            title : 'Insert Box',
            image : 'tinymce3/themes/advanced/img/insertdiv.gif',
            onclick : function() {
                ed.selection.setContent('<div class=\"initial_div\"></div>');
 
            }
        });
    }
 
		
	});
	
	       
 
function convertWord(type, content) {
	switch (type) {
		case "before":
   var r1 = "<";
   var r2 = ">";
content = content.replace(/<font\b([^>]+)style=['"]([^>]+)bold([^>]*)['"]([^>]*)>([^>]+)<\/font>/gim, r1 + 'strong' + r2 + '$5' + r1 + '/strong' + r2);
content = content.replace(/<span\b([^>]+)style=['"]([^>]+)bold([^>]*)['"]([^>]*)>([^>]+)<\/span>/gim, r1 + 'strong' + r2 + '$5' + r1 + '/strong' + r2);
content = content.replace(/<strong\b([^>]*)>/ig, r1 + 'strong' + r2);
content = content.replace(/<\/strong\b([^>]*)>/ig, r1 + '/strong' + r2);
content = content.replace(/<b\b([^>]*)>/ig, r1 + 'strong' + r2);
content = content.replace(/<\/b\b([^>]*)>/ig, r1 + '/strong' + r2);
content = content.replace(/<font\b([^>]+)style=['"]([^>]+)italic([^>]*)['"]([^>]*)>([^>]+)<\/font>/gim, r1 + 'em' + r2 + '$5' + r1 + '/em' + r2);
content = content.replace(/<span\b([^>]+)style=['"]([^>]+)italic([^>]*)['"]([^>]*)>([^>]+)<\/span>/gim, r1 + 'em' + r2 + '$5' + r1 + '/em' + r2);
content = content.replace(/<em\b([^>]*)>/ig, r1 + 'em' + r2);
content = content.replace(/<\/em\b([^>]*)>/ig, r1 + '/em' + r2);
content = content.replace(/<i\b([^>]*)>/ig, r1 + 'em' + r2);
content = content.replace(/<\/i\b([^>]*)>/ig, r1 + '/em' + r2);
content = content.replace(/<a\b([^>]+)href=['"]([^>]+)['"]([^>]*)>/ig, r1 + 'a href="$2"' + r2);
content = content.replace(/<\/a\b([^>]*)>/ig, r1 + "/a" + r2);
content = content.replace(/<h2\b([^>]*)>/ig, r1 + 'h2' + r2);
content = content.replace(/<\/h2\b([^>]*)>/ig, r1 + '/h2' + r2);
content = content.replace(/<h3\b([^>]*)>/ig, r1 + 'h3' + r2);
content = content.replace(/<\/h3\b([^>]*)>/ig, r1 + '/h3' + r2);
content = content.replace(/<p\b([^>]*)>/ig, r1 + 'p' + r2);
content = content.replace(/<\/p\b([^>]*)>/ig, r1 + '/p' + r2);
content = content.replace(/<br\b([^>]*)>/ig, r1 + '/br' + r2);
content = content.replace(/<ul\b([^>]*)>/ig, r1 + 'ul' + r2);
content = content.replace(/<\/ul\b([^>]*)>/ig, r1 + '/ul' + r2);
content = content.replace(/<ol\b([^>]*)>/ig, r1 + 'ol' + r2);
content = content.replace(/<\/ol\b([^>]*)>/ig, r1 + '/ol' + r2);
content = content.replace(/<li\b([^>]*)>/ig, r1 + 'li' + r2);
content = content.replace(/<\/li\b([^>]*)>/ig, r1 + '/li' + r2);
content = content.replace(/<table\b([^>]*)>/ig, r1 + 'table' + r2);
content = content.replace(/<\/table\b([^>]*)>/ig, r1 + '/table' + r2);
content = content.replace(/<tr\b([^>]*)>/ig, r1 + 'tr' + r2);
content = content.replace(/<\/tr\b([^>]*)>/ig, r1 + '/tr' + r2);
content = content.replace(/<th\b([^>]*)>/ig, r1 + 'th' + r2);
content = content.replace(/<\/th\b([^>]*)>/ig, r1 + '/th' + r2);
content = content.replace(/<td\b([^>]*)>/ig, r1 + 'td' + r2);
content = content.replace(/<\/td\b([^>]*)>/ig, r1 + '/td' + r2);
 
			break;
 
		case "after":
			content = content.replace(/(\r\n|\n)/g, "");
			break;	
		case "keyup":
    case "keydown":
    if (tinyMCE.isMSIE && e.ctrlKey)
        window.setTimeout('tinyMCE.triggerNodeChange(false);', 1);
    if (e.ctrlKey && e.keyCode == 86 && e.type != "keyup") {
        tinyMCE.execInstanceCommand(e.target.editorId, "mcePasteText", true);
        tinyMCE.cancelEvent(e);
        return false;
    }
break;			
	}
	return content;
}
 
function FileBrowser(field_name, url, type, win) {              
        mceWin = win;         
        if (type == 'image') {
        page = '$path_info_dir$/filebrowser.html?type=' + type;
        var mcePopup = window.open(page, '', 'width=600, height=450, scrollbars=yes, resizable=yes, inline=yes');
    }
    else if (type == 'file') {
        // mceBrowseLinks('$path_info_dir$/testupload/', field_name, 'mcePopup')
        page = '$path_info_dir$/images/linkbrowser';
        var mcePopup = window.open(page, '', 'width=600, height=450, scrollbars=yes, resizable=yes, inline=yes');
    }
}
function mceInsertImage(url, field) 
{    
    window.opener.mceWin.document.getElementById(field).value = url;
    window.opener.mceWin.showPreviewImage(url);
    window.opener.mceWin.focus();
    window.close()
    
}
 
function mceInsertLink(url, field) 
{
    var target_field = window.opener.mceWin.document.getElementById(field);
    target_field.value = url; 
 
    window.opener.mceWin.focus();
    window.close()   
}
 
</script>
 
 
    <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
    <script type="text/javascript" src="js/jquery.form.min.js"></script>
    <script type='text/javascript' src="js/facebox.min.js"></script>
    <script type='text/javascript' src="js/jquery.livequery.min.js"></script>
    <link href="js/facebox.css" media="screen" rel="stylesheet" type="text/css" />
  <script type="text/javascript">
    jQuery(document).ready(function($) {
      $('a[rel*=facebox]').livequery(function(){  
    $(this).facebox({
        loading_image : 'loading.gif',
        close_image   : 'closelabel.gif'
      }) 
    })
   })
  </script>
 
 
<script type="text/javascript">
$().ready(function() {
  $('#form_publish').bind('form-pre-serialize', function(e) {
    tinyMCE.triggerSave();
   });   
  $('#form_publish').ajaxForm({
   target: '#article_draft_list',
   success: function(){
      $('#article_draft_list').fadeIn('slow');
   }
   });
 return false;
  });
 
</script>
 
 
 
</head>
<body topmargin="0" leftmargin="0">
 
 
 
 
<div id="article_editing">
  <div id="rich_text_editor">
  <form id="form_publish" action="ajaxsavedraft.html">
   <input type="hidden" value="$articleid$" name="articleid"><input type="hidden" value="yes" name="save">
     
     <textarea name="articlebody" id="articlebody" rows="1" cols="20">$articlebody$</textarea>
     <input type="submit" id="save_draft" value="Save as draft">
  </form>
  </div>
  <div id="article_sidebar">
 
     <h3 class="sidebar_title">Drafts <span>(Intials Y-M-D)</span></h3>
     <div id="article_draft_list">
 
     </div>
     
    
  
  </div>
</div>
 
 
</body>
 
</html>

Open in new window

0
Dave6969
Asked:
Dave6969
  • 3
1 Solution
 
TigerStyleCommented:
Can you provide the dependencies (or links to them) ? (the jquery plugins and the example data)
0
 
Dave6969Author Commented:
Sorry it's taken me sooo long to respond. I had by broadband cut due to an administrative error at my ISP.

I'm afraid I can't give you links to the actual pages as it's on a corporate intranet, but I'm pretty much just using the Jquery form plugin (from http://malsup.com/jquery/form/).

LiveQuery is in there because I've been trying to get Facebox working with our internal proxy servers but it seems I'm fighting a losing battle there so I'm going to have to revert to Thickbox and experiment with the stylesheets to make the popups look more facebook-y. So you can ignore the other plugins.

Like I say this works completely fine in Firefox (I should even be able to make a scripted, timed autosave) but IE6 refuses to play ball :-(
0
 
Dave6969Author Commented:
I'm still having troubles with this....

I'm guessing that because I didn't respond for so long dues to other problems, interest has been lost.

Do I need to ask a new question?
0
 
Dave6969Author Commented:
I've solved it!

I wasn't putting the method into the form. Firefox doesn't mind this, but IE can't cope and won't submit it.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now