You are not logged in.
Hello,
for the last days i tried setting up xinha in the following way but without success.
Basically i need to enable / disable a xinha editor object:
- Given a basic web page build via php using one or more textareas.
- Each textarea should have an edit button / link or reacts on a rightclick.
- When a user clicks this button, link or textarea, this textarea should turn into a xinha wysiwyg editor.
- The user does the changes and clicks a save button.
- The save button does call a javascript function.
- The Java script function retrieves and stores the value from xinha.
- The Java script function updates the textarea field.
- The Javascript restores the textarea field and deletes / destroys / removes the xinha editor object.
- The Javascript then performs any custom actions.
The major problem is to have control over enableing / disableing the editor objects.
Once the editor object is created i can get the value of it's content and update the textarea content. Also passing the content to the server via xajax is not a problem. But then i cannot get rid of the editor object ;-)
So the editor object still stays at it's place.
As a work around i thought of working with an iframe or div within the main webpage and enableing just one editorobject there. Then copy data from the textarea in question into that editorobject, make it visible, edit it there, copy data back and disable the editorobject after. But also in this way, i would have to get rid of at least one object instance.
Has anyone made something similar?
A simple example that shows how to enable / disable a xinha object would be perfect.
P.S. Thank you in advance for reading this post ;-)
Offline
I made some progress:
//mydiv section containing the textarea and therefore xinha
//state: block | none
xinha_editors.taedit.deactivateEditor();
toggledisplay(mydiv, "style.display", state);
xinha_editors.taedit.activateEditor();
This works fine. However i have to run these commands after the page has fully loaded. E.g. using a button with an onclick event or a href.
But when i try to disable the section containing the editor in body onload, within body or at the end of body, i get an error that the xinha_editors.taedit would not have such a property. So i assume it is not fully initiallized at that time.
Is there anyway around this, so one can load and initialize the xinha_editor but keep it nonvisible using style display:none?
Offline
No, you would have to initialize it on first display. This is due to a bug in either gecko or IE, I forget which, which means that getting sizes and such is not possible when elements are set to display:none (well, not strictly a bug, because if it's display:none then it has no size!).
No reason you can't initialize your editor(s) on first display instead of onload though - but it's left as an excercise in javascript for you :-)
James Sleeman
Offline
Thank you for the hint -;) I will have a look at it.
Because it seems to that the thread below deals with a similar issue, i'll link them.
Offline
What a timely thread.....
Ok, I have this working. Xinha is only loaded ONCE, no matter what the starting visibility state is.
However, if the Xinha editor has focus when the div visibility is toggled (several times), then the editor becomes unstable. This is true even if the editor got focus, then lost focus (by clicking into a text entry field). It seems that once it has focus, the unstable behaviour starts.
The immediate noticable effect is that the B, I, and U buttons show as ON, and you cannot make the editor the focus.
Offline
Random: are you doing activateEditor and deactivateEditor at the appropriate times? You must deactivate before changing the visibility and activate after restoring (or if you just leave it deactiveated it will activate when you click in it).
James Sleeman
Offline
Random: are you doing activateEditor and deactivateEditor at the appropriate times?
No. I must have missed that in the discussion :-(
Sigh. More state stuff to track.
I don't suppose there is some way to trap the visibility event? So that the editor could do it automagically? Also, with multiple text areas on the same page, and possibly each text area existing in a different hide/show block, how do I activate/deactivate an individual text area?
block 1 -----
textarea A
block 2 -----
textarea B
textarea C
block 3
textarea D
For a LONG page, I was hoping to be able hide/show blocks as the user wants, so they only need to see where they are currently editing (plus some blocks are not relevant to that user at that instance).
Since I can only initialize Xinha once (for all text areas?), if the initial state is to have block 1 showing, and blocks 2 and 3 hidden, then the text areas in blocks 2 and 3 will have a size of 0 by 0? Is there a way to force the editor to re-calculate its size? Or does activateEditor do this:
xinha.A.activateEditor();Offline
activateEditor just switches on the designMode functions.
There is no reason you can't initialize your xinha editors one at a time as and when they are first displayed, you'll have to learn some Javascript to do it though. Just read through the initialization code in the newbie guide and go from there.
I don't know of any way of trapping visible/invisible events in the DOM.
James Sleeman
Offline
I've been trying this:
Do not do xinha_init until the first call for visibility
deactivate editor on any call for hiding the div block
that werx for 1 editor
but
the other editors become unstable because they are hidden when the xinah init is run. How does one init the textareas individually? I've seen it done somewhere but now I cant find the example where it was done.
I'll create a complete writeup of how to hide/unhide editors once I figure out how to init individual windows correctly.
Thanks gogo, your the bestest
Offline
In xinha_init, comment out the startEditors line.
Then to start the individual editors, after running xinha_init, you can do
xinha_editors.yourEditorIdHere.generate();for each one.
James Sleeman
Offline
Wow.
I am using Xinha (well, will be) on over 150 pages. To ease the coding I am using a Java object to generate all the required code for any page which uses a textarea. Until I needed to hide/show block, this was straight forward. I am also using a Java object to generate the code required for the block show/hide (it sends the block state back to the server to be stored in the user's session using a background request).
All this just got a whole lot more complicated. I need to track the state of each editor through two sets of states (not started/started visible/not visible).
Ok, must be what must be. Thanks for your input.
Offline
ok, how do I detect if the editor has been started already so I dont start it twice? I was using something like
if(!xinha_editors) xinha_init;before. Now I want to say something like
if(!myEditorID.alreadyGenerated)myEditorID.generate();If I let the generate function run more than once on the same editor then bad stuff happens.
Offline
HURRAH! got it working, cleaning code for a full writeup. Will be linked soon.
Offline
DOH! Stupid IE burst my bubble.
Ok, what is it about toggling fullscreen edit or htmltidy that sets the editor back to functional. If the editor goes poop-mode and then I viewhtml source and then back its ok again. why??
/me starts reading htmlarea.js again
Offline
HURRAH! got it working, cleaning code for a full writeup. Will be linked soon.
Any Progress? ;-)
Offline
I am also very curious about this. The current setup we are trying to use xinha in is very simple. We are not trying to use multiple editors on a page or anything like that, though eventually we might like to. Right now I would just like to get a proof of concept working well. The main problem we are having is "activating" the editor. When it loads, the editor is in the "disabled" or "inactive" state, and we want the user to be able to start working right away without having to click into the editor. The other problem is that when the editor is in the "inactive" state (after it loads), when a plugin is using a panel (in this case Stylist with a right panel) the panel does not initialize and fill out until the user manually clicks into the editor, thereby activating it. Additionally, once this happens, since the dom is dynamically manipulated the page layout gets weird. To fix this all that needs to be done is to resize the window; however, the user should not be required to do this every time they want to load up the editor.
I have been trying to manually simulate a user click on the xinha editor elements to no success. Essentially, what I am wanting to do is to have the editor already loaded and active when the page loads. I know there is some bug in gecko that is not making this possible. Are there any known work arounds? What exactly is this bug?
Thanks for any help that anyone can give me.
Offline
anyone got solution to this problem? I am trying to do the same thing, with the show and hide, so i can reuse the same text area and not have to reload them everytime. The problem occur when i am switching from hide to show. The textarea just freeze. I can not edit the text area. anyone have any ideas?
Offline
I solve my problem where the xinha freeze. Well this is not exactly a good solution, I use a dummy div in another frame, and when change the div from hide to show, i also set the display of the dummy div from hide to show and it solves my problem. hope this help anyone who encounter the same problem.
Offline
has anyone figured out how to hide/show and editor?
i want to start with it hidden so i had to call my hide function inside the xinha_init function. otherwise i have sizing issues in firefox.
while i was writing the code, i put an alert() in the hide/show function as the very first thing it did just to see the value of a certain variable. everything worked perfect in ie and ff. however, when i took out the alert(), it didn't work anymore. it would not load the text into the editor. any ideas? i'm including the code that worked.
function showhide(id)
{
alert(document.getElementById(id).style.display);
if(document.getElementById(id).style.display != "block")
{
return setVisible(id);
}else
{
return setHidden(id);
}
}
function setVisible(id)
{
document.getElementById(id).style.display = "block";
}
function setHidden(id)
{
document.getElementById(id).style.display = "none";
}Offline
using the activate/deactivate, i can show/hide the editor without having an alert box. however, i am still having trouble setting its initial state hidden. if i set it hidden via css, when it is shown the size is terribly wrong. when i put the hide function in xinha_init, i get an error saying "this._doc has no properties" on line 2173 of XinhaCore.js. this is within the deactivate function. the script stops running due to the error, and it never hides the editor.
if i remove the activate function, the editor hides but the text does not load unless i put in an alert(). i don't want an alert() popping up at every load. is there a way to check to see if an editor has been started? that may help.
i am guessing it is my lack of knowledge of javascript and that this issue can be overcome. anyway, i can't seem to find a fix in this thread. in fact, if you read the thread, you get the feeling that it was either never solved or solved and never reported. any other ideas?
Last edited by beanstalk (2007-02-06 18:03:04)
Offline
i think my issue is that i am calling the hide function within the xinha_init function. i need to call xinha_init and hide() on window.load. how do i accomplish that? i've tried some examples i've found on the web, but xinha_init does not seem to work like my hide() function. it will not work with these multiple window.onload functions. any tips? thanks.
Offline
1. I think it could work if you use visibility:hidden instead of display:none
2. if you set window.onload = someFunction you replace any previous function
var onLoadCache = window.onload;
window.onload = function () {
onLoadCache();
yourFunction();
}or you can use (instead of simple window.onload)
Xinha._addEvent(window,"load",xinha_init);
Xinha._addEvent(window,"load",yourFunction);this way you can add functions.
But I reckon this will not work either, you may have to set a timeout , because it takes some time until the editor is fully generated and you can safely hide it
Offline
finally got it. i used a static variable to mark whether i had already generated the editor. i removed the starteditor in xinha_init and stuck with the display css. i set display to block and then called the showhide() function at the end of xinha_init to hide the div. hope this helps someone.
beenhere = false;
function showhide(id)
{
if(beenhere===true){xinha_editors.contracttext.deactivateEditor();}
if(document.getElementById(id).style.display != "block")
{
if(beenhere===false)
{
xinha_editors.contracttext.generate();
beenhere = true;
}
setVisible(id);
}else
{
setHidden(id);
}
//if(beenhere===true){xinha_editors.contracttext.activateEditor();}
return true;
}
function setVisible(id)
{
document.getElementById(id).style.display = "block";
}
function setHidden(id)
{
document.getElementById(id).style.display = "none";
}Offline