Extend dijit.Dialog with template content using arguments

Submitted by sunaluak on Tue, 01/15/2008 - 06:15.

OK, so far I am 0/3 for responses by anybody else but myself for any of my questions posted on this forum (to be fair, I answered - and replied to - one of my questions before anybody else had a chance to respond, but still...!) but I am stuck once again, so maybe somebody out there might be able to help me?

I am trying to do something that seems like it should be exceedingly simple - extend the dijit.Dialog widget with some additional variables and load those variables, programmatically defined, in the popup using a template.

Here is my template:



 
${popupTitle}


	${row1Content}


	${row2Content}


${title}

And here is my declaration:

dojo.declare(
	"dst.MyPopup",
	dijit.Dialog,
	{
		popupTitle : "My Popup Title",
		row1Content : "This is row 1",
		row2Content : "This is row 2",
		href : "../media/MyPopup.html",
	}
);

And here is where I instantiate the widget in my page:

myPopup = new dst.MyPopup({title: "Default dijit.Dialog title"});
		myPopup.show();

I get a dialog with the table correctly displayed and the Dialog title correct, but within the table all I get is:
${popupTitle}
${row1Content}
${row2Content}
${title}
...
Notice that it doesn't even correctly load the ${title} variable within the containerNode, when the ${title} should have been inherited from dijit.Dialog...
I have tried various alternatives to the above, even making my declaration simply extend [dijit._Widget, dijit._Templated] instead of dijit.Dialog and when dst.MyPopup.show() is declared, load a template that contains a dialog widget using {href: this.href} - the result is the same. The dialog loads, the table is displayed, but the contents in the table do not display the extended variable values, only the '${...}' values. How can I pass these custom variables into the content of the parent Dialog widget so they display?

Thanks in advance - -

Login or register to post comments
Subscribe post

Found a workaround

Submitted by sunaluak on Wed, 01/16/2008 - 08:56.

Instead of extending dijit.Dialog, I used this:

dojo.declare(
	"dst.MyPopup",
	[dijit._Widget, dijit._Templated],
	{
		popupTitle : "My Popup Title",
		row1Content : "This is row 1",
		row2Content : "This is row 2",
		templatePath: dojo.moduleUrl("", "./MyPopup.html"),
		popup : null,
		
		postMixInProperties: function() {
			this.popup = new dijit.Dialog({});
		},

		show: function(){
        	   this.popup.setContent(this.domNode);
        	   this.popup.show();
		}
	}
);

Doesn't seem ideal but its transparent from the webpage, I can still call:

var myDlg = new dst.MyPopup({});
myDlg.show();

and the dialog appears with the correct variable values in it. Needs polish of course, but at least it works now.

Search

Extend dijit.Dialog with template content using arguments

Found a workaround