複数のtinymceエディターを1ページに表示できません

Question

私は、アコーディオンとタイミスを一緒に使用しているページがあります。

アコーディオンコントロールの展開/折りたたみコンボごとに、編集ボタンがあります。編集ボタンをクリックすると、2つの入力があるフォームが表示されます。最初のものはテキストボックス、もう1つはテキストエリアです。

私はテキストエリアをtinymceインスタンスにします。アコーディオンコントロールには複数の展開/折りたたみコントロールがあり、私はそれらのそれぞれにスティミュライスインスタンスを表示したいと思います。予想通り

tinyMCE.init({ 
    // General options 
    mode : "textareas", 
    theme : "advanced", 
    plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template", 

    // Theme options 
    theme_advanced_buttons1 : "bold,italic,underline,|,blockquote,|,justifyleft,justifycenter,justifyright,justifyfull,|,paste,pastetext,pasteword,|,bullist,numlist,|,advhr,|,forecolor,formatselect", 
    // theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect", 
    theme_advanced_buttons2 : "", //"cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor", 
    theme_advanced_buttons3 : "", //"tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen", 
    theme_advanced_buttons4 : "", //"insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak", 
    theme_advanced_toolbar_location : "top", 
    theme_advanced_toolbar_align : "left", 
    theme_advanced_statusbar_location : "bottom", 
    theme_advanced_resizing : true, 
}); 

を次のように私はクロームとFirefoxのページをロードするとき

私のTinyMCEのinitコードは、アコーディオンのコントロールが表示されます。しかし、最初の崩壊部には錫の制御だけが現れます。崩壊部の残りの部分は、通常のテキストエリアを表示し、編集者は表示しません。

私はIEでテストしていません。

誰かが助けてくれますか？私は何が間違っているのか分かりません。事前に

おかげで Puneet

Answer 1

すべてのtextarea要素のIDが異なることを確認し、問題を修正しました。 TinyMCEのエディタプラグインは

Answer 2

はmode: 'exact',を使用してみてくださいとelement設定ですべての要素-IDをリスト。

Answer 3

を表示されますが（たとえばlibに/ tinytextarea.htmlのため）リモートファイルでTinyMCEのコードを分離し、それがリモートファイル

からロードされるときにtextareaのidを変更する私のjQueryプラグインを使用してそれを読み込むことができる場所TEXTAREAであります

$.fn.loadChangeTAreaId = function(urlpath,prefix,suffix){ 
    $(this).load(urlpath, function(data) { 
     $(this).find('textarea[id]').andSelf().attr('id', function(index, previous) { 

      return prefix+ previous+suffix; 
     }); 
    }) 

使用方法

$('#divContainer').loadChangeTAreaId('lib/tinytextarea.html','pre','suf'); 

以前のtextarea idが "ELM" であれば、新しいIDは、あなたのテキストエリアにTinyMCEのをバインドするにはどうすればよい "preelmsuf"