You are not logged in.
What I'm trying to do:
Whenever the Xinha editor loses focus, I want to grab its contents and
autosave the contents to a database.
This is what I've tried:
myTextArea is the name & id of the <textarea> I turned into a Xinha Editor.
I see that Xinha has wrapped my myTextArea in an iframe and when typing in the
editor, it is NOT my myTextArea which is being modified.
I attempted to use the SaveOnBlur plugin, which appears to copy the HTML from
the editor into myTextArea . I'm using jQuery to try and wire up a change event
handler, but jQuery says it will NOT fire change until myTextArea loses focus.
In an attempt to make jQuery fire the change event, I modified the SaveOnBlur
plugin to do this:
SaveOnBlur.prototype.xinha_update_textarea = function () {
this.editor._textArea.value = this.editor.outwardHtml(this.editor.getHTML());
this.editor._textArea.focus();
this.editor._textArea.blur();
}
Still no luck. I can't catch change, blur, or losefocus.
I can see the above method get called in Firebug, but the event handler function I
wired up never gets called. If I remove Xinha editor from the picture, my event
handler, when wired to blur event does get called anytime the user tabs off
myTextArea.
Thanks.
Offline
Addendum to previous post: I am attaching my event handler to myTextArea. I don't see how to attach an event handler to the Xinha Editor for blur, losefocus, or change...
Offline
You should just call the event handler directly from the SaveOnBlur function.
SaveOnBlur.prototype.xinha_update_textarea = function () {
this.editor._textArea.value = this.editor.outwardHtml(this.editor.getHTML());
myEventHandlerHere();
}
James Sleeman
Offline
Thanks gogo, but I went with this after finding a similar post in the forum.
Seems like I should be wiring my event handler up the the editor attached
to my textarea. This code works, so I'm now under the impression that I
should be using _addEvent to wire up handlers with the Editor for any events
I wish to handle.
Does this seem correct?
_wireOnBlur: function() {
var self = this;
// you have to wait until every thing is initialized
this.myEditor.whenDocReady (
function() {
Xinha._addEvent(self.myEditor._doc, "blur", onBlur);
self._getContents();
}
);
// blur handler
function onBlur (event) {
self._putContents();
return true;
}
},
Offline
Don't use jQuery (I found the same problem). Basically do what I did above.
Use Xinha._addEvent to wire up to blur. I found that I had to wire up the editor's iframe in the case
of IE, my editor's doc in the case of other browsers (Chrome and FFox). The below code snippet is from
a javascript class I created, therefore I used a closure on
var self = this;
in order to remember the current instance when the actual event handler is called. If you do not have a
class, then the closure is not neccessary.
/******************************************************************************/
/* Wire up blur handler with Xinha itself. */
/******************************************************************************/
_wireOnBlur: function() {
var self = this;
// you have to wait until every thing is initialized
this.myEditor.whenDocReady (
function() {
Xinha._addEvent(self.myEditor._iframe, "blur", onBlur); // IE
Xinha._addEvent(self.myEditor._doc, "blur", onBlur); // FF, chrome
self._getContents();
}
);
// blur handler
function onBlur (event) {
self._putContents();
return true;
}
},
Last edited by patschannach (2011-10-10 11:41:44)
Offline