Get Id of TitlePane programatically defined to show/hide

Question

I am very new to Dojo and this is what I am trying to do. I have a titlepane which is programatically declared using the code below:

     var pane = this._createTitlePane(config.widgets.title,  config.widgets.position, 
                 config.widgets.open);

_createTitlePane: function (title, position, open, optclass) {
          var tp = new TitlePane({
            title: title,
            open: open
          }).placeAt(this.sidebar, position);
          domClass.add(tp.domNode, 'titlePaneBottomFix titlePaneRightFix');
          if (optclass) {
            domClass.add(tp.domNode, optclass);
          }
          tp.startup();
          return tp;
        },

Later I am trying to hide this title pane when a button is clicked using esri.hide. My question is how do I get a reference to this title pane? There's no Id when it is defined. When I look in the chrome debugger, I see the below line highlights the widget

  <div class="titlePaneBottomFix titlePaneRightFix dijitTitlePane" title="" role="group"    id="dijit_TitlePane_1" widgetid="dijit_TitlePane_1">

If I try to do something like esri.hide(dojo.byId("dijit_TitlePane_1")), then it hides the widget. But can I refer to the title pane using this widget Id?

Answer 1

You may want to just give the title pane its own id in the function:

_createTitlePane: function (title, position, open, optclass, paneId) {
      var tp = new TitlePane({
        title: title,
        id: paneId, // TitlePane id here
        open: open
      }).placeAt(this.sidebar, position);
      domClass.add(tp.domNode, 'titlePaneBottomFix titlePaneRightFix');
      if (optclass) {
        domClass.add(tp.domNode, optclass);
      }
      tp.startup();
      return tp;
}  

Then you can refer to it with and hide it with:

esri.hide(dijit.byId("theIdYouGaveIt").domNode);

To understand the difference between dojo.byId and dijit.byId, this link may help.