Quantcast

Having trouble with 'this'

classic Classic list List threaded Threaded
4 messages Options
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Having trouble with 'this'

dolot
I have the following function:

function theAdminDojoTools() {

    this.wireUserDeActivateEvents = function () {
        var userDiv = document.getElementById("userListDiv");
        var deactiveButtons = userDiv.getElementsByClassName("deactivateUserButton")
        for (var i = 0; i < deactiveButtons.length; i++) {
            deactiveButtons[i].onclick = this.deactivateUser;
        }
    }

    this.deactivateUser = dojo.hitch(this, function (evt) {
        var UserId = evt.srcElement.dataset.userid;
        require(["dojo/request/xhr"], function (xhr) {
            var url = "/users/DeactivateUser"
            var postData = { id: UserId }
            new xhr(url, { method: "POST", data: postData }).then(this.deactiveUserSuccess(), this.deactiveUserFailure());
        });
    });

    this.deactivateUserSuccess = dojo.hitch(this, function (data) {
        alert("user deactivated.")
    });
   
    this.deactivateUserFailure = function (data) {
        alert("failure deactivate")
    }

    var self = this;
}

The problem I'm having is in the deactivateUser function.  When this function is called, in the xhr promise, deactiveUserSuccess is always undefined (as is deactiveUserFailure :) ).  It seems that 'this' in this context refers to the html element whose click event called deactivateUser .

I've tried referring to 'self' instead of 'this'.  No success.

I've tried removing the various dojo.hitch functions.  No success there either.

'this' always refers to something other than 'theAdminDojoTools'.  

I have similar functionality in other parts of my app and it works just fine.  I can't help but think I've overlooked something.

Any ideas?
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Having trouble with 'this'

Peter_dojo
Quick dirty hack....:
Define a local variable and us it !





var me=this;

 this.deactivateUser = dojo.hitch(this, function (evt) {
        var UserId = evt.srcElement.dataset.userid;
        require(["dojo/request/xhr"], function (xhr) {
            var url = "/users/DeactivateUser"
            var postData = { id: UserId }
            new xhr(url, { method: "POST", data: postData
}).then(  /* !!!  */  me.deactiveUserSuccess(), /***!!*/  me.deactiveUserFailure());
        });
    });



Peter


On 17/06/16 20:57, dolot wrote:

> I have the following function:
>
> function theAdminDojoTools() {
>
>     this.wireUserDeActivateEvents = function () {
>         var userDiv = document.getElementById("userListDiv");
>         var deactiveButtons =
> userDiv.getElementsByClassName("deactivateUserButton")
>         for (var i = 0; i < deactiveButtons.length; i++) {
>             deactiveButtons[i].onclick = this.deactivateUser;
>         }
>     }
>
>     this.deactivateUser = dojo.hitch(this, function (evt) {
>         var UserId = evt.srcElement.dataset.userid;
>         require(["dojo/request/xhr"], function (xhr) {
>             var url = "/users/DeactivateUser"
>             var postData = { id: UserId }
>             new xhr(url, { method: "POST", data: postData
> }).then(this.deactiveUserSuccess(), this.deactiveUserFailure());
>         });
>     });
>
>     this.deactivateUserSuccess = dojo.hitch(this, function (data) {
>         alert("user deactivated.")
>     });
>    
>     this.deactivateUserFailure = function (data) {
>         alert("failure deactivate")
>     }
>
>     var self = this;
> }
>
> The problem I'm having is in the deactivateUser function.  When this
> function is called, in the xhr promise, deactiveUserSuccess is always
> undefined (as is deactiveUserFailure :) ).  It seems that 'this' in this
> context refers to the html element whose click event called deactivateUser .
>
> I've tried referring to 'self' instead of 'this'.  No success.
>
> I've tried removing the various dojo.hitch functions.  No success there
> either.
>
> 'this' always refers to something other than 'theAdminDojoTools'.  
>
> I have similar functionality in other parts of my app and it works just
> fine.  I can't help but think I've overlooked something.
>
> Any ideas?
>
>
>
>
> --
> View this message in context: http://dojo-toolkit.33424.n3.nabble.com/Having-trouble-with-this-tp4006923.html
> Sent from the Dojo Toolkit mailing list archive at Nabble.com.

--
Dojo Toolkit: http://dojotoolkit.org/
Tutorials: http://dojotoolkit.org/documentation/

[hidden email]
To unsubscribe, visit: http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Having trouble with 'this'

dolot
Are you allowed to grill crow before you eat it - or at least put some ketchup on it?  

The problem was a simple typo.  The function I wanted to call was deactivateUserSuccess, but what I had in the promise was deactiveUserSuccess.  I overlooked it over and over.

DOH!!!  AARRGGHHH!!! (bangs head against wall).  I guess I could go off on the typical 'javascript is not a strongly typed language' rant, but I should know that by now.  This was just plain old boneheadedness.

But now I did have to use a local variable like you said.  I had tried that before, and it would have worked had I been referring to the correct function.  UUUGH.....
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Having trouble with 'this'

DojoNovice
This post has NOT been accepted by the mailing list yet.
This post was updated on .
In reply to this post by dolot
try this, you have invalid scope and using constructor, use literal and check my update, you had many bugs there, i tried to fixed them.

and change modules, "dojo/_base/lang"
"dojo/request/xhr"

var userActions = {    wireUserDeActivateEvents : function () {
        var userDiv = document.getElementById("userListDiv");
        var deactiveButtons = userDiv.getElementsByClassName("deactivateUserButton")
        for (var i = 0; i < deactiveButtons.length; i++) {
            deactiveButtons[i].onclick = this.deactivateUser;
        }
    } ,

    deactivateUser : function (evt) {
        var UserId = evt.srcElement.dataset.userid;
     
            var url = "/users/DeactivateUser";
            var postData = { id: UserId };
            new xhr(url, { method: "POST", data: postData }).then(this.deactiveUserSuccess, this.deactiveUserFailure);
       
    },

    deactivateUserSuccess : function (data) {
        alert("user deactivated.")
    },
   
    deactivateUserFailure : function (data) {
        alert("failure deactivate")
    }
}

userActions.wireUserDeActivateEvents();
Loading...