Latest Contributions by JamesCrandall

Yes!  (this also made me go look/check and is helping me understand the various things I need to consider -- thanks!!!) define(['dojo/_base/declare',         'dijit/_WidgetsInTemplateMixin',         'jimu/BaseWidget',         'jimu/dijit/TabContainer',         'jimu/utils',         'dojo/_base/lang',         'dojo/on',         'dojo/Deferred',   'dojo/_base/Color',   'dojo/_base/array',   'dojo/dom-construct',   'dojo/dom-class',   'dojo/keys',   'jimu/dijit/LoadingIndicator',   'jimu/dijit/Popup',   'dijit/form/ValidationTextBox', ... function(declare,     _WidgetsInTemplateMixin,     BaseWidget,     TabContainer,     utils,     lang,     on,     Deferred,     Color, array, domConstruct, domClass, keys,     LoadingIndicator, Popup, ValidationTextBox, ...‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ ... View more

Thank you, Ken! ... View more

That did it Robert.  Thanks a million for taking the time on this. ... View more

From Roberts excellent simplified example, I cannot seem to identify what I've done wrong.  Getting error: "Unexpected token (" on the  _initTabContainer: function() and running out of things to try. define(['dojo/_base/declare',   'dijit/_WidgetsInTemplateMixin',   'jimu/BaseWidget',   'jimu/dijit/TabContainer',   'jimu/utils',   'dojo/_base/lang',   'dojo/on'     ], function(declare,   _WidgetsInTemplateMixin,   BaseWidget,   TabContainer,   utils,   lang,   on) {   return declare([_WidgetsInTemplateMixin, BaseWidget]), {    postCreate: function() {     this._initTabContainer();     _initTabContainer: function() {      var tabs = [];      tabs.push({       title: 'Tab 1',       content: this.tabNode1      });      tabs.push({       title: 'Tab 2',       content: this.tabNode2      });      this.selTab = 'Tab 1';      this.tabContainer = new TabContainer({       tabs: tabs,       selected: this.selTab      }, this.tabIdentify);      this.tabContainer.startup();      this.own(on(this.tabContainer, 'tabChanged', lang.hitch(this, function(title) {       if (title !== 'Tab 1') {        //do something now that Tab 2 has been selected       }      })));      utils.setVerticalCenter(this.tabContainer.domNode);     };   }; }   });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ ... View more

Excellent! ... View more

define(['dojo/_base/declare',   'dijit/_WidgetsInTemplateMixin',   'jimu/BaseWidget',   'jimu/dijit/TabContainer',   'jimu/utils',   'dojo/_base/lang',   'dojo/on' ], function(declare,   _WidgetsInTemplateMixin,   BaseWidget,   TabContainer,   utils,   lang,   on) {   return declare([_WidgetsInTemplateMixin, BaseWidget], {    postCreate: function() {     this._initTabContainer();     _initTabContainer: function() {      var tabs = [];      tabs.push({       title: 'Tab 1',       content: this.tabNode1      });      tabs.push({       title: 'Tab2',       content: this.tabNode2      });      this.selTab = 'Tab 1';      this.tabContainer = new TabContainer({       tabs: tabs,       selected: this.selTab      }, this.tabIdentify);      this.tabContainer.startup();      this.own(on(this.tabContainer, 'tabChanged', lang.hitch(this, function(title) {       if (title !== 'Tab 1') {        //do something now that Tab 2 has been selected       }      })));      utils.setVerticalCenter(this.tabContainer.domNode);     }    }   }); } );‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ I think the problem is improper "}" and ")" at the bottom.  I can't see straight after trying to line these up. Among other errors, TypeError: clazz is not a constructor is at the top in dev tools.  JSLint doesn't seem to be able to even get past the define at the top. ... View more

I've been able to screw up even this simple example.  It's the squiglies and writing this in TextPad that has me in double-vision. I've got the exact html and css but here is the js: define(['dojo/_base/declare',         'dijit/_WidgetsInTemplateMixin',         'jimu/BaseWidget',         'jimu/dijit/TabContainer'], function (declare,     _WidgetsInTemplateMixin,     BaseWidget,     TabContainer,     utils) {       return declare([_WidgetsInTemplateMixin, BaseWidget], {    postCreate: function () {    this._initTabContainer();      _initTabContainer: function () {      var tabs = [];      tabs.push({        title: 'Tab 1',        content: this.tabNode1      });      tabs.push({        title: 'Tab2',        content: this.tabNode2      });      this.selTab = 'Tab 1';      this.tabContainer = new TabContainer({        tabs: tabs,        selected: this.selTab      }, this.tabIdentify);      this.tabContainer.startup();      this.own(on(this.tabContainer,'tabChanged',lang.hitch(this,function(title){        if(title !== 'Tab 1'){       //do something now that Tab 2 has been selected        }      })));      utils.setVerticalCenter(this.tabContainer.domNode);       }    }    } )‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ ... View more

All of the nls references seem to cause errors even tho I've added everything into my strings.js that is found in your identify widget's strings.js but it cannot seem to resolve the issue.  The whole replacing strings/labels/etc. is just too complex for what I hoped to find.  A panel with two tabs that I can just plop in my set of controls and js code -- but I can't seem to quite squish it into anything already exists.  thanks a bunch for your input! <div>   <div data-dojo-attach-point="tabIdentify">     <div class="identify-tab-node" data-dojo-attach-point="tabNode1">    ...just plop in some new attach points on this tab and execute the js     </div>     <div class="identify-tab-node" data-dojo-attach-point="tabNode2">      ...just plop in some new attach points on this tab too and execute the js     </div>   </div> </div> ... View more

I see. ... View more

this.openCity(event, 'London')‍ Now I am not sure where that should go.  (can this type of development be spread out even more, my ADHD hasn't limited out yet   ) ... View more

Error: Uncaught ReferenceError: openCity is not defined which I guess the botton classes need to be "data-dojo-attach-event"?  But not sure how to pass the arguments to the openCity function in the .js Widget.html: <div> <div class="tab">   <button class="tablinks" data-dojo-attach-point='tablinksExhibit' onclick="openCity(event, 'London')">London</button>   <button class="tablinks" data-dojo-attach-point='tablinksExhibit' onclick="openCity(event, 'Paris')">Paris</button>   <button class="tablinks" data-dojo-attach-point='tablinksExhibit' onclick="openCity(event, 'Tokyo')">Tokyo</button> </div> <div id="London" class="tabcontent" data-dojo-attach-point='tabExibit'>   <h3>London</h3>   <p>London is the capital city of England.</p>   <div class="main-div" data-dojo-attach-point='mainDiv'></div> </div> <div id="Paris" class="tabcontent" data-dojo-attach-point='tabExibit'>   <h3>Paris</h3>   <p>Paris is the capital of France.</p> </div> <div id="Tokyo" class="tabcontent" data-dojo-attach-point='tabExibit'>   <h3>Tokyo</h3>   <p>Tokyo is the capital of Japan.</p> </div> </div>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ Widget.js (I didn't do anything with cityName yet): openCity: function(evt, cityName) {            // Declare all variables            var i, tabcontent, tablinks;            // Get all elements with class="tabcontent" and hide them            //tabcontent = document.getElementsByClassName("tabcontent");            tabcontent = domClass.add(this.tabExibit, 'tab');            for (i = 0; i < tabcontent.length; i++) {                tabcontent[i].style.display = "none";            }            // Get all elements with class="tablinks" and remove the class "active"            //tablinks = document.getElementsByClassName("tablinks");            tablinks = domClass.add(this.tablinksExibit, 'tab');            for (i = 0; i < tablinks.length; i++) {                tablinks[i].className = tablinks[i].className.replace(" active", "");            }            // Show the current tab, and add an "active" class to the button that opened the tab            document.getElementById(cityName).style.display = "block";            evt.currentTarget.className += " active";    },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ ... View more

I see.  Will give it a go! Much appreciated. ... View more

I can't even get THIS to fully work. The entire widget.html needs to be encapsulated inside of a <div> .. </div> for the widget to open without error, but then the <script> section doesn't seem to fire and nothing appears when a tab is clicked. The code is pretty much exactly as found in the simple example.  <div> <div class="tab">   <button class="tablinks" onclick="openCity(event, 'London')">London</button>   <button class="tablinks" onclick="openCity(event, 'Paris')">Paris</button>   <button class="tablinks" onclick="openCity(event, 'Tokyo')">Tokyo</button> </div> <div id="London" class="tabcontent">   <h3>London</h3>   <p>London is the capital city of England.</p>   <div class="main-div" data-dojo-attach-point='mainDiv'></div> </div> <div id="Paris" class="tabcontent">   <h3>Paris</h3>   <p>Paris is the capital of France.</p> </div> <div id="Tokyo" class="tabcontent">   <h3>Tokyo</h3>   <p>Tokyo is the capital of Japan.</p> </div> <script> function openCity(evt, cityName) {     var i, tabcontent, tablinks;     tabcontent = document.getElementsByClassName("tabcontent");     for (i = 0; i < tabcontent.length; i++) {         tabcontent[i].style.display = "none";     }     tablinks = document.getElementsByClassName("tablinks");     for (i = 0; i < tablinks.length; i++) {         tablinks[i].className = tablinks[i].className.replace(" active", "");     }     document.getElementById(cityName).style.display = "block";     evt.currentTarget.className += " active"; } </script> </div>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ ... View more

As far as using the GP widget inside your widget that is a pretty daunting task Definitely -- I was only attempting to just use it as reference, I need something to go off of to try and implement a tabbed panel ... View more