Javascript accessing parent function variable

Question

hi I have a Question about accessing variables that are in a parent function

var DateRangePicker = function (name, clickFunction) {
    this.context = name;
    this.UpdateGraph = clickFunction;
    this.FinalDate = function () {
        var Dates = $(this.context).find("[name=datepickerText]").val().split('-');
        return Dates[1];
    };
    this.InitialDate = function () {
        var Dates = $(this.context).find("[name=datepickerText]").val().split('-   ');
       return Dates[0];
    };
    $(this.context).find("[name=UpdateDatepicker]").click(function () {
        var pickerText = $(InnerContext).find('[name=datepickerText]');
        var dates = pickerText.val().split('-');
        UpdateGraph(InitialDate(), FinalDate());
        $(context).find("[name=Toogler]").click();
    });
    return this;
}

How can i access the "this.UpdateGraph()" function inside the updateDatepicker click so far it sais that UpdateGraph and this.UpdateGraph doesnt exists

Answer 1

You can bind the this context to your handler function, to keep from having an extra scope variable:

$(this.context).find("[name=UpdateDatepicker]").click(function () {
    var pickerText = $(this.InnerContext).find('[name=datepickerText]');
    var dates = pickerText.val().split('-');
    this.UpdateGraph(this.InitialDate(), this.FinalDate());
    $(this.context).find("[name=Toogler]").click();
}.bind(this));