javascript, dojo, building dialogs in jsp's with enclosures

Question

I am using closures in dojo dialogs to keep functions and variables from colliding.

I have a jsp page that includes a complex dialog. It is mostly working. Just one really annoying detail. if the widget changes how do I notify a handler method? we want as much of the java script for the dialog to be kept within the closure.

Since the popup appears in multiple locations I want future programmers to be able to replace myVar with anything. Is there a way to determine what to correctly put in the onChange

------jsp page-----
var myVar = new MyNewPopupStuff(42); myVar.contstrucDialog(); ...... includeTemplate template="myDialog.jsp" .....

--------myDialog.jsp----
< script type="text/javascript" src="my.js"/>

.....

< div id="myDialogData" dojotype="dijit.layout.ContentPane" region="right" splitter="true" class="data" style=" width:50%; " > <\/div>
....

--------my.js file----

function MyNewPopupStuff(param){

     this.contstrucDialog = function()
     .......
     while( more widgets to add){
           fieldHolder=dojo.byId("myDialogData"
     addWidget(widgetName,myDialogData);
     }

     addWidget = function(fieldHolder, widgetName){
     // need to print the name of the variable in "myVar.bar()" (myVar or what ever it may be)
     dojo.place(newLabel, fieldHolder);
        var newField = new dijit.form.ValidationTextBox({
        id: "i"+contactTypeId,
        name: widgetName,
        value: value,
        trim: true,
       **onChange:**??????when the widget is mofied I want to call the below modifyOnChange not some other modify on change  I think I want something like myVar.modifyOnChange????

    });
    }


    this.modifyOnChange = function()
     {
         alert("modified");
     }
}

LHMathies LHMathies · Accepted Answer · 2011-05-25T15:24:13

If you're using a framework that implements the EcmaScript 5 bind method for functions, use:

onChange: modifyOnChange.bind(this),

else implement it yourself with:

onChange: (function(self) {
    return function() {
        return modifyOnChange.apply(self, arguments);
    }
})(this),

myVar.modifyOnChange might work, but what's the point of abstracting stuff into a class if you then tie the code to the global you expect to be holding the object? And what happens if somebody wants to add another MyNewPopupStuff object?

javascript, dojo, building dialogs in jsp's with enclosures

1 Answers