[Dojo-interest] extending dijit.Dialog
John.C.Cartwright at noaa.gov
John.C.Cartwright at noaa.gov
Thu Jul 23 19:14:48 EDT 2009
Thanks for your reply Mike.
When I try to extend dijit.Dialog directly, I get the error:
multibeam.SurveySelect2 is not a constructor
the calling code is:
var popup = new multibeam.SurveySelect2({title: 'this is the title',
foo:'testme'});
popup.show();
and the new class is listed below. Could you share w/ me an example
where you're extending Dialog and how you're programatically calling it?
Thanks again for your help!
--john
new class directly extending Dialog:
dojo.provide('multibeam.SurveySelect2');
dojo.require('dijit.Dialog');
dojo.declare('multibeam.SurveySelect2', [dijit.Dialog, dijit._Templated], {
templatePath: dojo.moduleUrl('multibeam','templates/SurveySelect2.html'),
widgetsInTemplate: true,
foo: 'foo...',
bar: 'bar!',
title: 'Default Title',
//set variables for the template
postMixInProperties: function() {
this.inherited(arguments);
},
postCreate: function() {
this.closeButton.onClick=dojo.hitch(this,'hide');
this.inherited(arguments);
}
});
----- Original Message -----
From: Mike Wilcox <mwilcox at sitepen.com>
Date: Thursday, July 23, 2009 3:14 pm
Subject: Re: [Dojo-interest] extending dijit.Dialog
> It's odd that you heard not to extend a Dialog, I do it all the
> time.
> Heather doesn't give solid reasons for it not to work. Regardless
> her
> solution is good enough to work with.
>
> You're probably running into the problem with Dialog that it fades
> out
> - so you technically can't destroy it for 500 ms or so. The browser
>
> won't let you because there are still objects pointing at dom nodes.
>
> There are many ways around this, but my suggestions are:
>
> - Reuse the same dialog - just hide it, and show it. This requires
> reseting your forms or whatever content is in there.
> - Create new dialogs and ignore the old ones that are hidden but
> not
> destroyed. This is hard for me to do, but I've been told old dom
> nodes
> laying around won't hurt anything.
>
> You could also try timers to destroy after 500ms, but things start
> to
> get hairy and its harder than it sounds.
>
> Mike Wilcox
> mwilcox at sitepen.com
> http://www.sitepen.com
> work: 650.968.8787 x218
> cell: 214.697.4872
>
> On Jul 23, 2009, at 3:58 PM, John.C.Cartwright at noaa.gov wrote:
>
> >
> > I realized that in my hide function, I was destroying the embedded
> > dijit.Dialog instance, but not containing instance itself. That
> > seems to
> > address the duplicate ids problem, but seems rather inefficient - is
> > there a better way? If I destroy the containing instance should
> > embedded Dialog instance be explicitly destroyed as well?
> >
> > Thanks again for the help!
> >
> > --john
> >
> > ----- Original Message -----
> > From: John.C.Cartwright at noaa.gov
> > Date: Thursday, July 23, 2009 2:42 pm
> > Subject: [Dojo-interest] extending dijit.Dialog
> >
> >> Hello All,
> >>
> >> I'm trying to create a custom dialog dijit. I've understood that
>
> >> there
> >> were complications in extending dijit.Dialog directly and that
> it was
> >> simpler to create a new dijit from _Widget and create a
> dijit.Dialog>> instance in composition.
> >>
> >> Heather describes the process at
> >> http://heather.koyuk.net/refractions/?p=246
> >> Seems to make sense, and the dialog comes up fine, however
> subsequent>> attempts to call it complain about the ids for the
> embedded>> NumberSpinner dijits already being in use. This despite
> calling>> destroyon the widget when it closes.
> >>
> >> I've included the JavaScript and template below - can someone
> please>> point out what I'm doing wrong? If I'm operating on a
> >> misconception and
> >> it's better to directly extend dijit.Dialog, could you recommend a
> >> reference on how to do that properly?
> >>
> >> Thanks for the help!
> >>
> >> --john
> >>
> >>
> >> call from the main page:
> >> function showSurveySelectDialog() {
> >> var popup = new multibeam.SurveySelect({foo:'testme'});
> >> popup.show();
> >> }
> >>
> >>
> >>
> >>
> >> SurveySelect.js:
> >>
> >> dojo.provide('multibeam.SurveySelect');
> >>
> >> dojo.require('dijit.Dialog');
> >>
> >> dojo.declare('multibeam.SurveySelect', [dijit._Widget,
> >> dijit._Templated], {
> >>
> >> templatePath:
> >> dojo.moduleUrl('multibeam','templates/SurveySelect.html'), popup :
> >> null, //dijit.Dialog in composition
> >> widgetsInTemplate: true,
> >> foo: 'foo...',
> >> bar: 'bar!',
> >>
> >> //set variables for the template
> >> postMixInProperties: function() {
> >> this.popup = new dijit.Dialog({});
> >> this.inherited(arguments);
> >> },
> >>
> >> postCreate: function() {
> >> this.closeButton.onClick=dojo.hitch(this,'hide');
> >> this.inherited(arguments);
> >> },
> >>
> >> show: function() {
> >> this.popup.attr("content", this.domNode);
> >> this.popup.show();
> >> },
> >>
> >> hide: function(){
> >> this.popup.destroy();
> >> }
> >>
> >> });
> >>
> >>
> >> SurveySelect.html
> >> <div class="surveyselect_class">
> >> <table bgcolor="yellow">
> >> <tr>
> >> <td colspan='2'><h3>Custom Popup</h3></td>
> >> <td>
> >> <div dojoAttachPoint='closeButton'
> >> dojoType='dijit.form.Button'>Close</div>
> >> </td>
> >> </tr>
> >> <tr>
> >> <td style='width: 48px'>Foo:</td>
> >> <td style='width: 48px'>${foo}</td>
> >> </tr>
> >> <tr>
> >> <td style='width: 48px'>Bar:</td>
> >> <td style='width: 48px'>${bar}</td>
> >> </tr>
> >> </table>
> >>
> >> <h4>Specify the Date Range</h4>
> >> <table>
> >> <tr>
> >> <td><label for="startYear">Start Year</label></td>
> >> <td>
> >> <div dojoType="dijit.form.NumberSpinner"
> >> style="width: 75px;"
> >> intermediateChanges="true"
> >> id="startYear"
> >>
> >> constraints="{min:1900,max:2010,pattern:'0000'}"
> >> value="2009">
> >> </div>
> >> </td>
> >> <td><label for="endYear">End Year</label></td>
> >> <td>
> >> <div dojoType="dijit.form.NumberSpinner"
> >> style="width: 75px;"
> >> intermediateChanges="true"
> >> id="endYear"
> >>
> >> constraints="{min:1900,max:2010,pattern:'0000'}"
> >> value="2009">
> >> </div>
> >> </td>
> >> </tr>
> >> </table>
> >> </div>
> >>
> >> _______________________________________________
> >> FAQ: http://dojotoolkit.org/support/faq
> >> Book: http://dojotoolkit.org/docs/book
> >> Forums: http://dojotoolkit.org/forum
> >> Dojo-interest at mail.dojotoolkit.org
> >> http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest
> >>
> > _______________________________________________
> > FAQ: http://dojotoolkit.org/support/faq
> > Book: http://dojotoolkit.org/docs/book
> > Forums: http://dojotoolkit.org/forum
> > Dojo-interest at mail.dojotoolkit.org
> > http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest
> >
>
> _______________________________________________
> FAQ: http://dojotoolkit.org/support/faq
> Book: http://dojotoolkit.org/docs/book
> Forums: http://dojotoolkit.org/forum
> Dojo-interest at mail.dojotoolkit.org
> http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest
>
More information about the Dojo-interest
mailing list