Loading ...
Sorry, an error occurred while loading the content.

Editor Query

Expand Messages
  • stuplum
    Using the following code, I can create an editor instance and fire the update function using the editor events, however the update function isn t able to
    Message 1 of 3 , Jul 31, 2008
    • 0 Attachment
      Using the following code, I can create an editor instance and fire the
      'update' function using the editor events, however the 'update'
      function isn't able to see any of the variables referenced in the init
      function.

      Does anyone know why this is or what i'm doing wrong - I'm kind of new
      to this style of js programming so please be gentle...

      (function() {
      var Dom = YAHOO.util.Dom, Event = YAHOO.util.Event;

      var description_editor = {
      config: {
      editor_wrapper_id: 'descEditor' // id of the wrapper element
      needed to find the id of the text area to be used as the editor
      },
      init: function() {
      this.timer = null;
      // use wrapper id to find dynamically produced textarea id -
      were using asp.net
      var _wrapper =
      Dom.get(description_editor.config.editor_wrapper_id);
      this.myTextarea = Dom.getFirstChild(_wrapper).id;

      var _myEditor = new YAHOO.widget.Editor(this.myTextarea,
      myToolbarConfig);
      this.myEditor = _myEditor;
      this.myEditor.on('afterNodeChange', description_editor.update);
      this.myEditor.on('editorKeyDown', description_editor.update);
      this.myEditor.render();
      },
      update: function(ev) {
      if (this.timer) {
      clearTimeout(this.timer);
      };
      this.timer = setTimeout(function() {
      Dom.get(this.myTextarea).value = this.myEditor.cleanHTML();
      }, 100);
      }
      };
      Event.onAvailable(description_editor.config.editor_wrapper_id,
      description_editor.init, description_editor, true);

      })();



      Best Regards

      Stuplum
    • Satyam
      Custom event listeners are called with this set to the object listened to, unless explicitly overridden. Thus, within the update function, this will point
      Message 2 of 3 , Jul 31, 2008
      • 0 Attachment
        Custom event listeners are called with 'this' set to the object listened
        to, unless explicitly overridden.

        Thus, within the update function, 'this' will point to what elsewhere is
        this.myEditor, which often is what you want.
        On the other hand, the function listening to the timeout (within the
        function listening to those custom events) has still another scope, in
        this case, this will point to window.

        Also, I think that calling this.saveHTML() would have the same effect
        than assigning to the textarea the cleaned html, which would make it
        even shorter.

        Besides, since you are not creating instances of description_editor
        (there is just a single copy of it) and you are already hiding it from
        the global namespace by enclosing it in an anonymous function, you might
        as well forget about it and make it all so much easier, forget about 'this'

        (function() {
        var Dom = YAHOO.util.Dom,
        Event = YAHOO.util.Event,
        config = {
        editor_wrapper_id: 'descEditor'
        },
        timer = null,
        myEditor = null;
        var update = function(ev) {
        if (timer) {
        clearTimeout(timer);
        timer = null;
        };
        timer = setTimeout(function() {
        myEditor.saveHTML();
        }, 100);
        };
        var init = function() {
        var _wrapper = Dom.get(config.editor_wrapper_id);
        var myTextarea = Dom.getFirstChild(_wrapper).id;

        myEditor = new YAHOO.widget.Editor(myTextarea, myToolbarConfig);
        myEditor.on('afterNodeChange', update);
        myEditor.on('editorKeyDown', update);
        myEditor.render();
        };
        Event.onAvailable(config.editor_wrapper_id,init);

        })();


        Satyam

        stuplum wrote:
        > Using the following code, I can create an editor instance and fire the
        > 'update' function using the editor events, however the 'update'
        > function isn't able to see any of the variables referenced in the init
        > function.
        >
        > Does anyone know why this is or what i'm doing wrong - I'm kind of new
        > to this style of js programming so please be gentle...
        >
        > (function() {
        > var Dom = YAHOO.util.Dom, Event = YAHOO.util.Event;
        >
        > var description_editor = {
        > config: {
        > editor_wrapper_id: 'descEditor' // id of the wrapper element
        > needed to find the id of the text area to be used as the editor
        > },
        > init: function() {
        > this.timer = null;
        > // use wrapper id to find dynamically produced textarea id -
        > were using asp.net
        > var _wrapper =
        > Dom.get(description_editor.config.editor_wrapper_id);
        > this.myTextarea = Dom.getFirstChild(_wrapper).id;
        >
        > var _myEditor = new YAHOO.widget.Editor(this.myTextarea,
        > myToolbarConfig);
        > this.myEditor = _myEditor;
        > this.myEditor.on('afterNodeChange', description_editor.update);
        > this.myEditor.on('editorKeyDown', description_editor.update);
        > this.myEditor.render();
        > },
        > update: function(ev) {
        > if (this.timer) {
        > clearTimeout(this.timer);
        > };
        > this.timer = setTimeout(function() {
        > Dom.get(this.myTextarea).value = this.myEditor.cleanHTML();
        > }, 100);
        > }
        > };
        > Event.onAvailable(description_editor.config.editor_wrapper_id,
        > description_editor.init, description_editor, true);
        >
        > })();
        >
        >
        >
        > Best Regards
        >
        > Stuplum
        >
        >
        > ------------------------------------
        >
        > Yahoo! Groups Links
        >
        >
        >
        >
        > No virus found in this incoming message.
        > Checked by AVG - http://www.avg.com
        > Version: 8.0.138 / Virus Database: 270.5.8/1582 - Release Date: 30/07/2008 18:37
        >
        >
        >
        >
      • stuplum
        Many thanks for the pointers Satyam Regards Stu ... listened ... elsewhere is ... might ... this ... description_editor.update); ...
        Message 3 of 3 , Jul 31, 2008
        • 0 Attachment
          Many thanks for the pointers Satyam

          Regards

          Stu


          --- In ydn-javascript@yahoogroups.com, Satyam <satyam@...> wrote:
          >
          > Custom event listeners are called with 'this' set to the object
          listened
          > to, unless explicitly overridden.
          >
          > Thus, within the update function, 'this' will point to what
          elsewhere is
          > this.myEditor, which often is what you want.
          > On the other hand, the function listening to the timeout (within the
          > function listening to those custom events) has still another scope, in
          > this case, this will point to window.
          >
          > Also, I think that calling this.saveHTML() would have the same effect
          > than assigning to the textarea the cleaned html, which would make it
          > even shorter.
          >
          > Besides, since you are not creating instances of description_editor
          > (there is just a single copy of it) and you are already hiding it from
          > the global namespace by enclosing it in an anonymous function, you
          might
          > as well forget about it and make it all so much easier, forget about
          'this'
          >
          > (function() {
          > var Dom = YAHOO.util.Dom,
          > Event = YAHOO.util.Event,
          > config = {
          > editor_wrapper_id: 'descEditor'
          > },
          > timer = null,
          > myEditor = null;
          > var update = function(ev) {
          > if (timer) {
          > clearTimeout(timer);
          > timer = null;
          > };
          > timer = setTimeout(function() {
          > myEditor.saveHTML();
          > }, 100);
          > };
          > var init = function() {
          > var _wrapper = Dom.get(config.editor_wrapper_id);
          > var myTextarea = Dom.getFirstChild(_wrapper).id;
          >
          > myEditor = new YAHOO.widget.Editor(myTextarea, myToolbarConfig);
          > myEditor.on('afterNodeChange', update);
          > myEditor.on('editorKeyDown', update);
          > myEditor.render();
          > };
          > Event.onAvailable(config.editor_wrapper_id,init);
          >
          > })();
          >
          >
          > Satyam
          >
          > stuplum wrote:
          > > Using the following code, I can create an editor instance and fire the
          > > 'update' function using the editor events, however the 'update'
          > > function isn't able to see any of the variables referenced in the init
          > > function.
          > >
          > > Does anyone know why this is or what i'm doing wrong - I'm kind of new
          > > to this style of js programming so please be gentle...
          > >
          > > (function() {
          > > var Dom = YAHOO.util.Dom, Event = YAHOO.util.Event;
          > >
          > > var description_editor = {
          > > config: {
          > > editor_wrapper_id: 'descEditor' // id of the wrapper element
          > > needed to find the id of the text area to be used as the editor
          > > },
          > > init: function() {
          > > this.timer = null;
          > > // use wrapper id to find dynamically produced textarea id -
          > > were using asp.net
          > > var _wrapper =
          > > Dom.get(description_editor.config.editor_wrapper_id);
          > > this.myTextarea = Dom.getFirstChild(_wrapper).id;
          > >
          > > var _myEditor = new YAHOO.widget.Editor(this.myTextarea,
          > > myToolbarConfig);
          > > this.myEditor = _myEditor;
          > > this.myEditor.on('afterNodeChange',
          description_editor.update);
          > > this.myEditor.on('editorKeyDown', description_editor.update);
          > > this.myEditor.render();
          > > },
          > > update: function(ev) {
          > > if (this.timer) {
          > > clearTimeout(this.timer);
          > > };
          > > this.timer = setTimeout(function() {
          > > Dom.get(this.myTextarea).value =
          this.myEditor.cleanHTML();
          > > }, 100);
          > > }
          > > };
          > > Event.onAvailable(description_editor.config.editor_wrapper_id,
          > > description_editor.init, description_editor, true);
          > >
          > > })();
          > >
          > >
          > >
          > > Best Regards
          > >
          > > Stuplum
          > >
          > >
          > > ------------------------------------
          > >
          > > Yahoo! Groups Links
          > >
          > >
          > >
          > >
          > > No virus found in this incoming message.
          > > Checked by AVG - http://www.avg.com
          > > Version: 8.0.138 / Virus Database: 270.5.8/1582 - Release Date:
          30/07/2008 18:37
          > >
          > >
          > >
          > >
          >
        Your message has been successfully submitted and would be delivered to recipients shortly.