Forum closed. New forum available at http://community.wymeditor.org/

Knowing if the editor area has been changed

Support forum for WYMeditor.

Knowing if the editor area has been changed

Postby troyr on Wed Feb 13, 2008 2:01 am

Hello all,
Is there a way to access the iframe to know whether the text inside the wymeditor panel has changed

eg.
On a normal input i can do
<input type="text" name="bleah" onchange="" />

What is the equivalent for wymeditor ?


Thanks in advance
troyr
 
Posts: 6
Joined: Tue Mar 06, 2007 4:39 am

Postby troyr on Thu Feb 14, 2008 11:29 pm

Alternatively, if no one has any ideas to the previous question, is there a way i could populate the textarea with the contents of the iframe when the iframe editor panel has lost focus.

e.g. Something similar to adding the 'wymupdate' class to the submit button.

Thanks in advance
troyr
 
Posts: 6
Joined: Tue Mar 06, 2007 4:39 am

Postby PACE on Mon Mar 10, 2008 4:46 pm

Hi

I did something like this, here's my code (mind you it's just test code, but it works):

Code: Select all
var editing = false;

jQuery(function() {
   //jQuery(".wymeditor").wymeditor();
   
   //$(document).bind("keyup", show_editable);
   
   $("body").bind("click", disable_editor);
   $(".editpane").bind("dblclick", enable_editor);
});

function enable_editor(par1) {
   
   if (!editing) {
      hide_editable();
      
      var orig_pane = $(this);
      
      var width = orig_pane.css("width");
      var height = orig_pane.css("height");
      
      
      orig_pane.wymeditor({
            html: orig_pane.html(),
            postInit: function(wym) { orig_pane.html(wym.xhtml()); wym }
         });
      
      $(".wym_box iframe").width(width);
      $(".wym_box iframe").height(height);
      
      editing = true;
   }
}

function disable_editor() {
   
   if (editing) {
      var editor = $.wymeditors(0);
      var orig_pane = editor._element;
      
      if (orig_pane.html() != editor.xhtml() && confirm("Save changes?")) {
         //$(".editpane").html($.wymeditors(0).xhtml());
         orig_pane.html(editor.xhtml());
         // -> postback changes
      }
      
      orig_pane.css("display", "");
      
      $(".wym_box").remove();
      WYM_INSTANCES = new Array(); // reinitialize global instance array
      
      editing = false;
   }
}

So the idea is to use the editor as an Ajax widget, when double clicking on the text it get's converted to a WymEditor, by clicking outside of the editor it get's disabled again (setting WYM_INSTANCES directly is a hack obviously but it works only this way)

On disabling edit mode, I compare orig_pane.html() to editor.xhtml(), which yields a save confirm dialog if the user changed anything.

Needs the jQuery Dimensions (needed to adjust the height of the editor to the to-be-edited text) extensions!

br,
Ben
PACE
 
Posts: 15
Joined: Fri Oct 12, 2007 10:24 am
Location: Austria

Postby jfh on Mon Mar 10, 2008 9:18 pm

Thanks for sharing!

FYI, current trunk now uses a namespace (no more global vars!), so WYM_INSTANCES becomes WYMeditor.INSTANCES.

I'll see if we can integrate the uninstantiation feature for the next release.
User avatar
jfh
Site Admin
 
Posts: 370
Joined: Sat Sep 23, 2006 8:43 pm
Location: Belgium

Postby troyr on Tue Mar 11, 2008 1:03 am

Thank you, this is what i was looking for :-)
troyr
 
Posts: 6
Joined: Tue Mar 06, 2007 4:39 am


Return to Support

Who is online

Users browsing this forum: No registered users and 2 guests