New widget with Content that Changes Best Practice

[KarenRobine]

I've setup 2 widgets (Web AppBuilder Developer Edition) that need to communicate with each other (ie. Widget1 and Widget2). I only want 1 open at a time.  Widget1 is set to openAtStart.  Then, when I select a point on the map, I want Widget1 to close, and Widget2 to open. Then, when I close Widget2, I want Widget1 to reopen. I pretty much have this concept working now, except I have a button for Widget2, so you can basically open it, separately  from Widget1 (which I don't want).  So what I want to do is have only 1 button to control all of this flow.. I'm trying to figure out the best way to do this. So some options I've come up with are as follows:

1. Option1:  Place all code in 1 widget and control the showing and hiding of the content using code. I'm not a huge fan of this, as it ends up placing separation of functionality within 1 widget... But I can use multiple dijits here to handle the code and separate the code that way.. So maybe option 1 is a good way to handle this.

2. Option2:  Figure out how to not display my second button associated with Widget2.  I'm not sure how to do this, and maybe it's not good practice?

3. Option3: Is there possibly a theme out there that supports what I'm trying to accomplish, or should I build a new theme for this? 

Thoughts on how to best handle this? Thanks.

[RobertScheitlin__GISP · Accepted solution]

Karen,

   If widget two will only ever be opened from widget one then you can just add a css rule  display: none for the widget 2 placeholder (button).

[KarenRobine]

Where would I set that rule?

[RobertScheitlin__GISP]

Karen,

   Is the widget in an onscreen widget placeholder or part of a controller widget like the header controller?

[RobertScheitlin__GISP]

Here is what I would add to the apps theme common.css if I wanted to hide the 3rd widget on screen place holder:

#dijit__WidgetBase_2{
  display: none;
}‍‍‍

[KarenRobine]

Mine is actually a "Header Controller" type of widget.  But I just did the following which worked:

div[settingid=<MyWidgetSetttingId>] {

display: none;

}

Thanks for the idea.

I'm still thinking about pursuing option 1 above. In my mind, I think if you setup a widget, it should be designed to run independently of other widgets. So still deciding whether mine would ever run that way. Thanks again.