Or could I do something like:

tinyMCE.init({ 
    ...
    theme_advanced_toolbar_location: "external",
    ...
});

And then somehow set a handler on each tinyMCE instance so when it gets focus it displays only it's toolbar at the top:

set all external toolbars to the same position, and hide them all by default:
<style type="text/css">
.mceToolbarExternal{
   display: none;
   position: absolute;
   top: 20px;
}
</style>

then I can just control each individual menu by:

document.getElementById('mce_editor_0_toolbar').style.display='';   etc...

is there a way to set a listener on a tinyMCE instance to fire off a javascript function when it gets focus?

@dtbaker

Hi, i have tryd your code but i diddent get it working can you send me a working sample on my email.

greats Krijn

Hi dave,

thank you verry much, it worked to bad of the older version but thats oke, you can edit divs now alse jquery rules.
i have one last question is an editors field is not selected your toolbar disapairs is it a nice idea to to display the current toolbar but at non editable mode. ( the gray non clickable toolbar ) and if how would i do that.
if you know i hope you would like to tell me.

Thnx in advance.

Krijn

Hi Dave,

It works great, used it to avoid the non editabe plugin now i give the parts i whant to edit the editor class and it works flawless.
manny thanks

Krijn

Hi dtbaker ,

    Your solution is very good but when I try to use it in Frames its not working. Like I have index.html, Toolbra.html and body.html and I want toolbar to be in toolbar and editable contents in body page and index have Frameset for the 2 pages. Can you please give me any idea that help applying your solution in Frames

Thanks

Thanks alot dtbaker,

  really gratefull for your reply. But there is problem with the example you have used with Frames. If you check you will find that Bold, Italic etc button not working and you lose focus on selected text once you apply these. Could you pleaseee fix this?

Thanks alot and waiting for your reply

@krijn if you are still around.
Simply wrap a single <form> around all your editable regions inside the iframe:

  <form action="save.php" method="post">
     <textarea class="editable"></textarea>
     <textarea class="editable"></textarea>
     <textarea class="editable"></textarea>
  </form>

Load the 'save' plugin for tinymce and register the 'save' button on the menu:

    plugins : "save,table,...
    theme_advanced_buttons1: "save,|,bold,....

now when you click the save button on any of the menu's, it should submit the single form containing all the editable regions.

Hello dtbaker,

   Sorry to ask you again and again. But please can you tell me is that bug that Toolbar functions not working in IE7 like bold, italic etc in your above Frame based solution?

Please help.

Thanks

Evening lordali,

Last time I tried, tinymce 3 did not have frame support.
Have a look in the version 3 tiny_mce_src.js file, see if you can find "mceAddFrameControl".
IIRC there was a comment in the code that said it was still a TODO.

Have a search of the forums and see if you can dig up when it is expected.

Dave

Thanks spocke for the reply,

   I researched on the info provided by you.

   I am using the version you have mentioned and looked for the add command and found this link http://wiki.moxiecode.com/index.php/TinyMCE:Commands

  I am using frame so I try to use this command
  function editor_init(){
   
    $(".editor",parent.bodyframe.document).each(
        function(){
        //alert("Binding to id: "+$(this).attr('id'));
           

        tinyMCE.execCommand('mceAddFrameControl', false, parent.bodyframe.document, $(this).attr('id'));

           
           
    }
    );
   
}

$(this).attr('id') get the right Id but div is not coming in edit mode. Page is empty and no control is on the page. Any help please

thanks

thanks but now how I write my command keeping in mind above code?

please

Command is

tinyMCE.execCommand('mceAddFrameControl',false,{element_id:'someid', window:frame.window, other_init_option:'xyz'});

My parameters are

element_id:$(this).attr('id')
Frame is = parent.bodyframe.document

used this command and tried many way but not working.
tinyMCE.execCommand('mceAddFrameControl',false,$(this).attr('id'), window.parent.bodyframe);

Tried both below commands but nothing works

tinyMCE.execCommand('mceAddFrameControl', false, {document:parent.bodyframe.document,element:$(this).attr('id')});
tinyMCE.execCommand('mceAddFrameControl', false, {window:parent.bodyframe.window,element:$(this).attr('id')});

please help

Last edited by lordali (2008-04-08 11:26:47)

Thanks mbajema,

   I did what you said and I get the error 'DOM.get{...}' is null or not an object.

Here is the URL to see the error http://test.qcvc.net/TinyMCE/index.html

please help