title: ExtJS 4 grid now showing after unhiding the div
body: <p>I am using ExtJS 4 grid, and my requirement is that the grid should be hidden at the first and should be visible when a certain button is pressed. <br><br>I dont know if it is a bug or anything, but the problem is that if set the <code>style="display:none;"</code> for the div on which im rendering the grid, and display it later on clicking a button, the grid does not show up. But instead if i show the grid first and the press the button for it to hide or display the grid, it works great.<br><br> Here is the code HTML and Javascript.<br>
  HTML:</p>
  
  <pre><code>&lt;div id="outPut"&gt;
      &lt;div id="gridShowClick" style="height: 50px; 
      width: 180px; background-color:Black; color:White; 
      padding-top:25px; text-align:center;" &gt;
                  Press to show the grid
  
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="hiddenDiv" style="display:none;" &gt;
      &lt;div id="exampleGrid" style=""&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>var grid;
      var colModel;
      Ext.onReady(function () {
          $("#gridShowClick").bind("click", showGridClick);
          colModel = [
              {
                  header: "Field 1",
                  menuDisabled: true,
                  width: 120,
                  sortable: false
              },
              {
                  header: "Field 2",
                  menuDisabled: true,
                  width: 120,
                  sortable: false
              },
              {
                  header: "Field 3",
                  menuDisabled: true,
                  width: 120,
                  sortable: false
              },
              {
                  header: "Field 4",
                  menuDisabled: true,
                  width: 120,
                  sortable: false
              },
              {
                  header: "Field 5",
                  menuDisabled: true,
                  width: 120,
                  sortable: false
              }
          ];
          grid = Ext.create('Ext.grid.Panel', {
              id: "exampleGridPanel",
              columns: colModel,
              columnLines: true,
              renderTo: "exampleGrid"
          });
      });
      function showGridClick() { $("#hiddenDiv").show(); }
  </code></pre>