Open side panel at start

6285
12
Jump to solution
03-18-2015 11:05 AM
SébastienMartin
New Contributor III

On a web app created with webapp builder, how can I make the legend on the sidebar open at start?

I tried to insert this in \widgets\Legend\config.json

"openAtStart": true

It's not working... Any idea?

Full config.json :

{
  "legend":{
    "arrangement": 0,
    "autoUpdate": true,
    "respectCurrentMapScale": true,
    "openAtStart": true
  }
}
1 Solution

Accepted Solutions
StanMcShinsky
Occasional Contributor III

I have tested this and it works great for me. Did you try to add the "openAtStart": true, to the main config file in the root of the application NOT in the \widgets\Legend\config.json? This config.json file is at the same level as your index.html file.

By the way, if you notice for the legend widget, the main config file does not even reference a legend config file by default.

      {
        "uri": "widgets/Legend/Widget",
        "version": "1.1",
        "id": "widgets/Legend/Widget_13",
        "index": 2,
        "name": "Legend",
        "label": "Legend"
      },

If you change a default attribute for the widget then it will create a new config file in configs/Legend/config_Legend.json and add the line of code to reference that new config.

      {
        "uri": "widgets/Legend/Widget",
        "version": "1.1",
        "id": "widgets/Legend/Widget_13",
        "index": 2,
        "name": "Legend",
        "label": "Legend",
        "config": "configs/Legend/config_Legend.json"
      },

Add the "openAtStart": true to this file in the Legend widget and it should work. If not then try clearing your browser cache and reload.

As I am looking at this I realize that this works for the default Foldable Theme and not for the Tab Theme. Is that the issue you are having?

For the Tab Theme here is how to get the side panel to open at start:

in the file: \themes\TabTheme\widgets\SidebarController\widget.js

make this one change on about line 61

      startup: function() {
        this.inherited(arguments);
        this.createTabs();
        //this.widgetManager.minimizeWidget(this);
        this.widgetManager.maximizeWidget(this);//changed this
      },

This maximizes the side panel at startup. Not sure how to tell it what widget to open first, but if you put the one you want open at the top then it will load in first.

-Stan

View solution in original post

12 Replies
KellyHutchins
Esri Frequent Contributor

You might want to post WAB questions to the Web AppBuilder for ArcGIS​ space in order to reach a larger group of people who are working with the Web App Builder.

SébastienMartin
New Contributor III

You're right, thanks

0 Kudos
StanMcShinsky
Occasional Contributor III

Martin Mimeault

You just need to add the

"openAtStart": true,

to the main config.json file in the root of the application.

      {
        "uri": "widgets/Legend/Widget",
        "version": "1.1",
        "id": "widgets/Legend/Widget_13",
        "index": 4,
        "name": "Legend",
        "label": "Legend",
        "openAtStart": true
      },

-Stan

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Stan,

   Unfortunately that does not work for panel widgets as Martin is looking for.

0 Kudos
JohnVarghese
New Contributor III

Robert,

Is there a way to insert an image (jpg) in the legend area?

Thanks.

John

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

John,


  It would be possible using DOM manipulation. I.e. Using dojo query to find the legend Dom element and then insert a new img element into that Dom. I don't have a sample for this tough.

0 Kudos
SébastienMartin
New Contributor III

Thanks but as Robert says, it's not working as the widget is in the side pannel.

Must be somewhere in the javascript Panel.js or TabWidgetFrame.js but I can't figure it out...

0 Kudos
DavidColey
Frequent Contributor

Don't side panels have a toggle property?

0 Kudos
StanMcShinsky
Occasional Contributor III

I have tested this and it works great for me. Did you try to add the "openAtStart": true, to the main config file in the root of the application NOT in the \widgets\Legend\config.json? This config.json file is at the same level as your index.html file.

By the way, if you notice for the legend widget, the main config file does not even reference a legend config file by default.

      {
        "uri": "widgets/Legend/Widget",
        "version": "1.1",
        "id": "widgets/Legend/Widget_13",
        "index": 2,
        "name": "Legend",
        "label": "Legend"
      },

If you change a default attribute for the widget then it will create a new config file in configs/Legend/config_Legend.json and add the line of code to reference that new config.

      {
        "uri": "widgets/Legend/Widget",
        "version": "1.1",
        "id": "widgets/Legend/Widget_13",
        "index": 2,
        "name": "Legend",
        "label": "Legend",
        "config": "configs/Legend/config_Legend.json"
      },

Add the "openAtStart": true to this file in the Legend widget and it should work. If not then try clearing your browser cache and reload.

As I am looking at this I realize that this works for the default Foldable Theme and not for the Tab Theme. Is that the issue you are having?

For the Tab Theme here is how to get the side panel to open at start:

in the file: \themes\TabTheme\widgets\SidebarController\widget.js

make this one change on about line 61

      startup: function() {
        this.inherited(arguments);
        this.createTabs();
        //this.widgetManager.minimizeWidget(this);
        this.widgetManager.maximizeWidget(this);//changed this
      },

This maximizes the side panel at startup. Not sure how to tell it what widget to open first, but if you put the one you want open at the top then it will load in first.

-Stan