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

event properties not accessable in functions called with window.setTimeout .

Expand Messages
  • Bhasker
    I ve stumbled upon this roadblock in ie ,its part of the itempotent event handling that im extending .more at
    Message 1 of 2 , Mar 1, 2007
    • 0 Attachment
      I've stumbled upon this roadblock in ie ,its part of the itempotent event handling that im extending .more at http://bosky101.blogspot.com/2007/02/adding-idempotent-event-handling-to.html

      now since i was able to post the event object to the final event handler i was satsified . But guess what ,the event object 's properties were only available in firefox . my guess is that its some scope problem .
      ive tried to simulate the similiar problem ... and the cases . ( just paste the below code into a new html or so.)


      <html><head>
      <script src="http://developer.yahoo.com/yui/build/yahoo/yahoo-min.js" type="text/javascript" ></script>
      <script src="http://developer.yahoo.com/yui/build/event/event-min.js" type="text/javascript" ></script>
      <script>
      function class1(_instantName){
        this.init( _instantName,document.getElementById('sample'),'click');  
      }

      class1.prototype = {
       params : new Object() ,
       init : function (_instantName,listenObj,listenEvent){
               this.instantName = _instantName;
               var _this= this;
               YAHOO.util.Event.addListener(listenObj,listenEvent,this.handle,_this);
       },
       handle : function (e,_this){
         var ev=YAHOO.util.Event.getEvent(e);
         _this.params["event"] = ev;
         alert(this+'is a button ,'+_this+' is the instance,'+_this.params["event"]["screenX"]);  //works on both ie , ff
         //cant use this ,bcoz youve made 'this' as the clicked object  !
         alert('_this.instantName is '+_this.instantName);
         window.setTimeout(_this.instantName+".foo();",1000);

       },
       foo : function(){
        alert('into foo'+this.params["event"]); // works till here both for ie and ff
        alert( this.params["event"].screenX); // this does not work in IE ( i get 'Member not found' in firebug.)
       }
      }


      var a ;
      function init(){
       var d = document.createElement('div');
       d.id='sample';
       d.innerHTML = 'click me and get the mouse co-od';
       document.body.appendChild(d);

        a = new class1('a');
       
      }
      </script></head>
      <body onload=init();></body></html>

      Whats really got me puzzled is that i can access the event properties (screenX) in handle() ,but not in foo()
      Also if i remove the setTimeout
             window.setTimeout(_this.instantName+".foo();",1000);
        with
            _this.foo();
       it works on ie as well !

      what could be the problem ? why is it that the object containing the event shows an object when i dont work with the settimeout  , but when i do - it has no properties in IE . am i missing some scope settings ?

      Keep Clicking,
      Bosky
    • Bhasker
      good news i found the fix . for those interested in knowing the issue . the problem was that i was trying to store the event object in a variable,and access it
      Message 2 of 2 , Mar 1, 2007
      • 0 Attachment
        good news i found the fix . for those interested in knowing the issue .

        the problem was that i was trying to store the event object in a
        variable,and access it later.it worked in firefox ,but not in IE,

        ...in IE , the event object CANNOT be accessed in functions that are NOT
        the function handlers .so i had to duplicate it while i had access to
        the event using the 'document.createEventObject' method that does just
        that . now that i have the event information persistent in an object,
        i was able to play around with it in any member function i wanted.


        http://msdn.microsoft.com/workshop/author/dhtml/reference/methods/createeventobj\
        ect.asp
        Quote:
        createEventObject Method

        Generates an event object for passing event context information when
        using the fireEvent method.

        Syntax

        oNewEvent = document.createEventObject( [oExistingEvent])

        Parameters

        oExistingEvent Optional. Object that specifies an existing event
        object on which to base the new object.

        Return Value

        Returns an event object.

        heres the final working code below.

        Keep Clicking,
        Bhasker V Kode, (architect / ReusableJS Framework )
        www.bosky101.blogspot.com

        PHP Code:
        <html><head>
        <script src="http://developer.yahoo.com/yui/build/yahoo/yahoo-min.js"
        type="text/javascript" ></script>
        <script src="http://developer.yahoo.com/yui/build/event/event-min.js"
        type="text/javascript" ></script>
        <script>
        function class1(_instantName){
        this.init( _instantName,document.getElementById('sample'),'click');
        }
        class1.foo = function(){
        try{
        /*START SNIPPET #1*/
        var _instant = eval('a');
        alert('in SNIPPET #1');
        alert('event is '+_instant.params["event"]); // goes into this
        for ie and ff
        alert( 'finallly '+_instant.params["event"]["screenX"]); // this
        does not work in IE
        /*END SNIPPET #1*/
        }catch(e){
        alert('error'+e);
        }
        }

        class1.prototype = {
        params : new Object(),
        init : function (_instantName,listenObj,listenEvent){
        this.instantName = _instantName;
        var _this= this;

        YAHOO.util.Event.addListener(listenObj,listenEvent,this.handle,_this);
        },
        handle : function (e,_this){
        var ev=YAHOO.util.Event.getEvent(e);

        if(document.createEventObject){
        _this.params["event"] =
        document.createEventObject();
        alert('setting event for ie');
        for(obj in e){
        try{
        _this.params["event"][obj]=e[obj];
        }catch(ec){
        //alert('error setting for ie event obj
        "'+obj+'"'+ec);
        }
        }

        }else{
        alert('setting event for ff');
        _this.params["event"] = ev;
        }


        /*START SNIPPET #1*/
        var _instant = eval('a');
        alert('in SNIPPET #1');
        alert('event is '+_instant.params["event"]); // works in IE
        & ff
        alert( _instant.params["event"]["screenX"]); // works in IE
        & ff
        /*END SNIPPET #1*/

        window.setTimeout("class1.foo();",1000);
        }

        }


        var a ;
        function init(){
        var d = document.createElement('div');
        d.id='sample';
        d.innerHTML = 'click me and get the mouse co-od';
        document.body.appendChild(d);
        a = new class1('a');
        }
        </script></head>
        <body onload=init();></body></html>
        --- In ydn-javascript@yahoogroups.com, "Bhasker" <bhaskervk@...> wrote:
        >
        > I've stumbled upon this roadblock in ie ,its part of the itempotent
        > event handling that im extending .more at
        >
        http://bosky101.blogspot.com/2007/02/adding-idempotent-event-handling-to\
        > .html
        >
        > now since i was able to post the event object to the final event handler
        > i was satsified . But guess what ,the event object 's properties were
        > only available in firefox . my guess is that its some scope problem .
        > ive tried to simulate the similiar problem ... and the cases . ( just
        > paste the below code into a new html or so.)
        >
        >
        > <html><head>
        > <script src="http://developer.yahoo.com/yui/build/yahoo/yahoo-min.js"
        > type="text/javascript" ></script>
        > <script src="http://developer.yahoo.com/yui/build/event/event-min.js"
        > type="text/javascript" ></script>
        > <script>
        > function class1(_instantName){
        > this.init( _instantName,document.getElementById('sample'),'click');
        > }
        >
        > class1.prototype = {
        > params : new Object() ,
        > init : function (_instantName,listenObj,listenEvent){
        > this.instantName = _instantName;
        > var _this= this;
        >
        > YAHOO.util.Event.addListener(listenObj,listenEvent,this.handle,_this);
        > },
        > handle : function (e,_this){
        > var ev=YAHOO.util.Event.getEvent(e);
        > _this.params["event"] = ev;
        > alert(this+'is a button ,'+_this+' is the
        > instance,'+_this.params["event"]["screenX"]); //works on both ie , ff
        > //cant use this ,bcoz youve made 'this' as the clicked object !
        > alert('_this.instantName is '+_this.instantName);
        > window.setTimeout(_this.instantName+".foo();",1000);
        >
        > },
        > foo : function(){
        > alert('into foo'+this.params["event"]); // works till here both
        for ie
        > and ff
        > alert( this.params["event"].screenX); // this does not work in IE ( i
        > get 'Member not found' in firebug.)
        > }
        > }
        >
        >
        > var a ;
        > function init(){
        > var d = document.createElement('div');
        > d.id='sample';
        > d.innerHTML = 'click me and get the mouse co-od';
        > document.body.appendChild(d);
        >
        > a = new class1('a');
        >
        > }
        > </script></head>
        > <body onload=init();></body></html>
        >
        > Whats really got me puzzled is that i can access the event properties
        > (screenX) in handle() ,but not in foo()
        > Also if i remove the setTimeout
        > window.setTimeout(_this.instantName+".foo();",1000);
        > with
        > _this.foo();
        > it works on ie as well !
        >
        > what could be the problem ? why is it that the object containing the
        > event shows an object when i dont work with the settimeout , but when i
        > do - it has no properties in IE . am i missing some scope settings ?
        >
        > Keep Clicking,
        > Bosky
        >
      Your message has been successfully submitted and would be delivered to recipients shortly.