Auto resize map div/container to 100% after a content pane is removed from the layout

RuchiraWelikala — Fri, 30 Aug 2013 15:52:19 GMT

Been at this for hours and I can't seem to figure it out.
I'm using AG-JSAPI 3.6

I have a map layout with a bordercontainer and two contentpanes, One is the map div and the other is the left div (which holds the legend, and basemaps and such as child elements).

Anyway, I have a checkbox element on the footer that when clicked, fires off a function that (should ideally) make the left div disappear and the map div expand to the width of the browser. The left div disappears as it should without any issue. However, the map div stays put.

    function toggleDiv() {         // If statement to check if the checkbox is checked.  if (dijit.byId("ToggleLeft").checked) {         //Sets the left div's display CSS property to inline and then setting the         //width property     dojo.setStyle(dijit.byId("leftDiv").domNode, 'display', 'inline');     dojo.byId("leftDiv").style.width = '285px';   }  else  {         // Sets the display css property to "none" which makes the element disappear      dojo.setStyle(dijit.byId("leftDiv").domNode, 'display', 'none');   };  }

The thing is, when I resize the browser, the map automatically resizes to the width of the browser. However, I want to do this as soon as the leftDiv element disappears. What js code would I have to use to get this to happen? Any help would be appreciated.

Thanks

Re: Auto resize map div/container to 100% after a content pane is removed from the la

JasonZou — Fri, 30 Aug 2013 16:05:35 GMT

You have to call resize method of the borderContainer object when any of the child elements resized. Add the below line to the end of the function.

dijit.byId("borderContainerID").resize();

Re: Auto resize map div/container to 100% after a content pane is removed from the la

RuchiraWelikala — Fri, 30 Aug 2013 16:41:54 GMT

You have to call resize method of the borderContainer object when any of the child elements resized. Add the below line to the end of the function.

dijit.byId("borderContainerID").resize();

Wow,
I can't believe I missed that!

Thanks so much, Jason.

topic Auto resize map div/container to 100% after a content pane is removed from the layout in ArcGIS JavaScript Maps SDK Questions

Auto resize map div/container to 100% after a content pane is removed from the layout

Re: Auto resize map div/container to 100% after a content pane is removed from the la

Re: Auto resize map div/container to 100% after a content pane is removed from the la