Resize brower window on mobile app

[MayJeff]

I try to perform a query search and click on the "view map" to zoom to specific parcel on the map. Everything works fine until you click the "Result button" back to query results list and resize the browser window then try to click on "View Map"  again. The map totally shows blank.

Here is my jsfiddle:

Edit fiddle - JSFiddle

Hope someone can give me some ideas.

Thank you.

[ChrisSergent]

Not sure but if you click on result again and then click map again, the map draws. So, it appears to affect just the first attempt.

[MayJeff]

Actually it happen every times you resize the browser window on query results list then click the "View Map" button.  If you click "Result button" and not resize browser window then able to see a polygon on the map when click "View Map" button.

Really don't know how to fit this.  Need Help!

[KellyHutchins · Accepted solution]

The reason this is happening is because its attempting to resize the map when its not visible which causes display issues. To resolve this I made two modifications to your source code. The first was to set the autoResize constructor option for the map to false to prevent the map from trying to resize itself each time the browser size changes.

            map = new esri.Map("map", {
                          basemap: "streets",
                          center: center,
                          zoom: zoom,
                          autoResize:false
                        });

The second update was to add logic to resizeMap to prevent it from trying to resize the map when the map view isn't visible. Here I check the display value and if its equal to none I exit resizeMap without modifying the map height.

  function resizeMap() {
                      //only resize when map view is visible
                      var selected = domStyle.get(dom.byId("mapView"),"display");
                      if(selected === "none"){
                        return;
                      }
                        mobile.hideAddressBar();
                        adjustMapHeight();
                        map.resize();
                        map.reposition();
                    }

Here's a revised version of your code showing those updates.

Mobile Map

[MayJeff]

Thank you very much for your help.