title: JQuery Dialog Initialization
body: <p>I continue getting this error when I click the close button (which doesn't close) on my JQuery Dialog:</p>
  
  <p><em>Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'</em></p>
  
  <p>in Chrome Tools after attempting a few of the suggested fixes on StackOverflow in other questions.</p>
  
  <p>Can anybody point out where I am not structuring the dialog correctly to cause this error?</p>
  
  <p>live fiddle <a href="http://jsfiddle.net/PTXZV/" rel="nofollow"><strong>here</strong></a></p>
  
  <pre><code>$(document).ready(function fooDialog() {
  
      $('#fooChartDialog').dialog({
          autoOpen: false,
          height: 600,
          width: 1000,
          resizable: false,
          buttons: {
              "Drill Down Report": function () {
                  window.open('example.com');
              },
              "Close": function () {
                  $(this).dialog("close");
              }
          },
          open: function () {
              $('#fooChartDialog').load($('#fooChartDialog').data('url'), function () {
                  fooChartLoad()
              });
          },
          title: 'Customer Satisfaction Chart',
          modal: true
      });
  
      $('#fooChartButton').click(function () {
          $('#fooChartDialog').dialog("open")
      });
  });
  </code></pre>