Login Register

Problem with a global variable; using xhr and deferred

First, what does my prog do?

Well, every keyup it validates input to see if there is a page on the server and stores the result in the _validationResult variable. Validation is simple; if the response is 200 OK, that means the page exists and _set_validationResultTrue is called (or in case it doesn't or it can't be reached, the _set_validationResultFalse is called). Next action happens onBlur. After the field looses focus, the _validationResult variable is checked and the appropriate message is being shown (nothing if it's valid, error message if it's invalid, the this._displayMessage() function).

Second, the problem:

Problem is, i can't seem to write anything in the _validationResult variable. Well, not that i can't, it just doesn't stick :) Thing is, default state is false. Then i write some input like test.html. Every time i type, _validationResult variable is set to false. Then, when i finish the last letter ("l"), the input is valid and the _validationResult variable is set to true. BUT when the field looses focus, it turns back to false! (or true, or "monkey" or anything that i put as default). I've been at this for hours and i can't seem to understand what's wrong. So here's the code and i hope someone can enlighten me :)

Code:

dojo.provide("seminar.SeminarValidationTextBox"); // all packages need to dojo.provide() _something_, and only one thing
dojo.require("dijit.form.ValidationTextBox"); //extends ValidationTextBox so it requiers it
dojo.declare("seminar.SeminarValidationTextBox", dijit.form.ValidationTextBox, {
    // In the begining, there is no input, so the default result of validation is naturally false
    // This is the variable that gives me grief

    _validationResult: false,

    //when the textfield loses focus validation results are shown
    _onBlur: function(evt){
		console.info("Blur " + this._validationResult);
        this._hasBeenBlurred = true;
        this._displayMessage();	
    },
    
    // validation is done on each keyup; _onMouse(evt) is for update of CSS classes
    onkeyup: function(evt){
        this.validator(this.textbox.value);
        this._onMouse(evt);
        if (this._validationResult == true) {
            this._displayMessage();
        }

    },
validator: function(value){
        if (value != "") {
            var def = dojo.xhrGet({
                url: value,
                // The LOAD function will be called on a successful response.
                load: function(response, ioArgs){ // ➃
                    return response;
                },
                // The ERROR function will be called in an error case.
                error: function(response, ioArgs){ // ➃
                    return response;
                }
            });
            def.addCallback(this._set_validationResultTrue);
            def.addErrback(this._set_validationResultFalse);
        }
    },
    // sets the result of validation
    _set_validationResultTrue: function(data, ioArgs){
        this._validationResult = true;
		console.info("Result " +this._validationResult);
    },
    _set_validationResultFalse: function(data, ioArgs){
        this._validationResult = false;	
		console.info("Result " +this._validationResult);
		    },

It looks like you are

It looks like you are passing a function reference to def.addCallback/def.addErrback. This means when that function executes, the "this" variable inside that function will be the def object.

Try instead using the forms of addCallback/addErrback where you pass the object you want treated as "this" when your validation functions get called:

def.addCallback(this, "_set_validationResultTrue");
def.addErrback(this, "_set_validationResultFalse");

Woot, you did it :) I knew

Woot, you did it :) I knew it had to be something with me not fully understanding how def works ;) Thank you.