Xinha Discussion Forum

evilc

Xinha Community Member

Registered: 2005-12-18

Posts: 19

Re: Howto to enable and disable xinha editor object via javascript?

beanstalk - I had a similar problem and found what was (for me) a better solution.
In apps where you change around the contents of the window, personally I prefer to take a while longer to load, but then when they flick to the frame with the xinha editor in it, xinha is already showing.

The approach I wanted to take was to load the editors at the beginning (which requires that they are visible - no way around that, I plan on overlaying the screen with a loading message.) and then hide them as soon as they were loaded. Problem was, that JS didn't seem to wait for starteditors to actually finish before executing the next bit of JS.

So, my solution was to poll the value of _iframeLoadDone for each editor. When all of them are true, all editors are loaded. Then you can hide them and carry on initialising your app.

Here is example code, enjoy

http://www.evilc.com/xb/onXinhaLoad.html

funtymeeee

New member

Registered: 2010-01-19

Posts: 3

Re: Howto to enable and disable xinha editor object via javascript?

I have modified the xhinaConfig.js file so that editor is loaded when the user clicks a link and not when the page loads.

Download and reference the Jquery library,  I have tested with version 1.2.6

Then modify the XinhaConfig.js file:

/* This compressed file is part of Xinha. For uncompressed sources, forum, and bug reports, go to xinha.org */
/* This file is part of version 0.95 released Mon, 12 May 2008 17:33:15 +0200 */
/* The URL of the most recent version of this file is http://svn.xinha.webfactional.com/trunk … aConfig.js */
xinha_editors=null;
xinha_init=null;
xinha_config=null;
xinha_plugins=null;
xinha_init=xinha_init?xinha_init:function(){
xinha_editors=xinha_editors?xinha_editors:["myTextArea"];
xinha_plugins=xinha_plugins?xinha_plugins:["CharacterMap","ContextMenu","SmartReplace","Stylist","Linker","SuperClean","TableOperations"];
if(!Xinha.loadPlugins(xinha_plugins,xinha_init)){
return;
}
xinha_config=xinha_config?xinha_config():new Xinha.Config();
xinha_config.pageStyleSheets=[_editor_url+"examples/full_example.css"];
xinha_editors=Xinha.makeEditors(xinha_editors,xinha_config,xinha_plugins);
Xinha.startEditors(xinha_editors);
};

$(document).ready(function(){

$("#start").click(function () {
      $("#blue").css("visibility","visible");
      $(document).ready(xinha_init);
    });

$("#end").click(function () {
      $("#blue").css("visibility","hidden");
    });
});

On the page where you have your text area and wish to use the editor add the following:

<div id="controls">
    <span id="start">Start</span>
    <span id="end">end</span>
</div>

That’s it in its basic form, you can build upon this as you like, in our final solution we have used radio buttons to toggle and activate the text editor.

There may be better ways to do this, but I’m sure this will help noobs like myself get started and in the right direction very quickly.

Garry Hopkins

New member

Registered: 2010-01-08

Posts: 2

Re: Howto to enable and disable xinha editor object via javascript?

Thanks Beanstalk this was of great help.