Auto resize map to 100% after content pane is removed in ArcGIS JavaScript API

Question

I'm using ArcGIS JavaScript API 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).

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.

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

};

}

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 JavaScript code would I have to use to get this to happen?

Answer 1

The answer I was looking for was provided at Auto resize map div/container to 100% after a content pane is removed from the layout.

Answer 2

Try resizing the border container as well as the map. (For me, I added a small delay to make the map redraw properly.)

//Resizes the border container
dijit.byId("border-container").resize();

//Resizes the map after 500 ms
setTimeout(function () {        
    map.resize();
}, 500);