title: jQueryUI .dialog("close") not working after ajax call
body: <p>I'm using jQueryUI's dialog with the modal form option to open a popup form. When the user clicks a button, it submits their input to a database, and then should close the dialog. Everything is working EXCEPT the closing of the dialog. (The manual Close button works; it just doesn't automatically close after coming back from the PHP database script. Here's the script code. (I tried to bold the line that's not working; apparently you can't nest bold inside of code tags, but the line is surrounded with double asterisks to make it stand out. Those are not part of the actual code!)</p>
  
  <pre><code>&lt;script&gt;
      $(function() {
          // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
          $( "#dialog:ui-dialog" ).dialog( "destroy" );
  
          var name = $( "#name" ),
              email = $( "#email" ),
              company = $( "#company" ),
              plate = $( "#plate"),
              allFields = $( [] ).add( name ).add( email ).add( company ).add( plate ),
              tips = $( ".validateTips" );
  
          function updateTips( t ) {
              tips
                  .text( t )
                  .addClass( "ui-state-highlight" );
              setTimeout(function() {
                  tips.removeClass( "ui-state-highlight", 1500 );
              }, 500 );
          }
  
          function checkLength( o, n, min, max ) {
              if ( o.val().length &gt; max || o.val().length &lt; min ) {
                  o.addClass( "ui-state-error" );
                  updateTips( "Length of " + n + " must be between " +
                      min + " and " + max + "." );
                  return false;
              } else {
                  return true;
              }
          }
  
          function checkRegexp( o, regexp, n ) {
              if ( !( regexp.test( o.val() ) ) ) {
                  o.addClass( "ui-state-error" );
                  updateTips( n );
                  return false;
              } else {
                  return true;
              }
          }
  
          $( "#dialog-form" ).dialog({
              autoOpen: false,
              height: 390,
              width: 350,
              position: 'top',
              modal: true,
              zIndex: 3000,
              buttons: {
                  "Submit your plate": function() {
                      var bValid = true;
                      allFields.removeClass( "ui-state-error" );
  
                      bValid = bValid &amp;&amp; checkLength( plate, "plate code", 1, 7 );
                      bValid = bValid &amp;&amp; checkLength( email, "email", 6, 80 );
                      bValid = bValid &amp;&amp; checkLength( company, "company", 1, 100);
  
                      bValid = bValid &amp;&amp; checkRegexp( email, /^((([a-z]|\d|[!#\$%&amp;'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&amp;'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. ismi@instoremarketer.org" );
  
  
                      if ( bValid ) {
  
                              var nameStr = name.val();
                              var emailStr = email.val();
                              var companyStr = company.val();
                              var plateStr = plate.val();
  
                              var string = 'name='+ nameStr+'&amp;email='+emailStr+'&amp;company='+companyStr+'&amp;plate='+plateStr;
                              //alert('string: '+string);
  
  
                              $.ajax({
                                 type: "POST",
                                 url: "submit_plate.php",
                                 data: string,
                                 dataType: 'json',
                                 cache: false,
                                 success: function(returnData){
                                                              alert(returnData.msg);
                                  if(returnData.error === false) {
                                      **$( this ).dialog( "close" );**
                                  }
                                  else {
                                      alert("Error: "+returnData.msg);
                                  }
                                }
  
                               });
  
  
                      }
                  },
                  Cancel: function() {
                      $( this ).dialog( "close" );
                  }
              },
              close: function() {
                  allFields.val( "" ).removeClass( "ui-state-error" );
              }
          });
  
          $( "#submit-plate" )
              //.button()
              .click(function() {
                  $( "#dialog-form" ).dialog( "open" );
              });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Any ideas?
  <strong>EDITED TO ADD PHP CODE</strong></p>
  
  <pre><code>&lt;?php
  include('../cfg/ez_sql.php');
  include('../cfg/db_setup.php');
  
  $err = false;
  if (isset($_REQUEST['plate'])) {
  
      $raw = "INSERT INTO dot_plate_submissions (plate_code, plate_name, plate_company, plate_email) VALUES ('%s', '%s', '%s', '%s')";
      $clean = sprintf($raw,
                 mysql_real_escape_string($_REQUEST['plate']),
                 mysql_real_escape_string($_REQUEST['name']),
                 mysql_real_escape_string($_REQUEST['company']),
                 mysql_real_escape_string($_REQUEST['email']));
  
      //error_log("cleaned query: $clean");
  
     $db-&gt;query($clean);
  }
  else {
      $err = true;
  }
  
  if($err) {
      $return['error'] = true;
      $return['msg'] = "There was an error submitting your plate";
  }
  else {
      $return['error'] = false;
      $return['msg'] = "made it to php";
  }
  echo json_encode($return);
  ?&gt;
  </code></pre>
  
  <p>So even if the error is false, the ajax call should still get back two pieces of data.</p>