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

[RuchiraWelikala]

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

[JasonZou · Accepted solution]

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();

[RuchiraWelikala]

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.