title: jQuery .validate() submitHandler not firing
body: <p>I'm loading a dialog box with a form that's built on-the-fly using <a href="http://bootboxjs.com/" rel="noreferrer">Bootbox.js</a> and I'm validating user input with a jQuery validate plugin.</p>
  
  <p>Validation works just fine, but the <code>submitHandler</code> is ignored when the form is filled in successfully.</p>
  
  <p>What's going wrong?</p>
  
  <pre><code>submitHandler: function(form) {
      alert("Submitted!");
      var $form = $(form);
      $form.submit();
  }
  </code></pre>
  
  <p>See the full example below. I've looked at other posts where a similar issue has been raised. Unfortunately they seem to have the form rendered on the page whereas I'm rendering my via jQuery.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).on("click", "[data-toggle=\"contactAdmin\"]", function() {
    bootbox.dialog({
      title: "Contact admin",
      buttons: {
        close: {
          label: 'Close',
          className: "btn btn-sm btn-danger",
          callback: function() {}
        },
        success: {
          label: "Submit",
          className: "btn btn-sm btn-primary",
          callback: function() {
            $("#webteamContactForm").validate({
              rules: {
                requestType: {
                  required: true
                }
              },
              messages: {
                requestType: {
                  required: "Please specify what your request is for",
                }
              },
              highlight: function(a) {
                $(a).closest(".form-group").addClass("has-error");
              },
              unhighlight: function(a) {
                $(a).closest(".form-group").removeClass("has-error");
              },
              errorElement: "span",
              errorClass: "help-blocks",
              errorPlacement: function(error, element) {
                if (element.is(":radio")) {
                  error.appendTo(element.parents('.requestTypeGroup'));
                } else { // This is the default behavior 
                  error.insertAfter(element);
                }
              },
              submitHandler: function(form) {
                alert("Submitted!");
                var $form = $(form);
                $form.submit();
              }
            }).form();
            return false;
          }
        }
      },
      message: '&lt;div class="row"&gt;  ' +
        '&lt;div class="col-md-12"&gt; ' +
        '&lt;form id="webteamContactForm" class="form-horizontal" method="post"&gt; ' +
        '&lt;p&gt;Please get in touch if you wish to delete this content&lt;/p&gt;' +
        '&lt;div class="form-group"&gt; ' +
        '&lt;div class="col-md-12"&gt; ' +
        '&lt;textarea id="message" name="message" class="form-control input-md" rows="3" cols="50"&gt;This email is to notify you the creator is putting a request for the following item\n\n' +
        this.attributes.getNamedItem("data-url").value + '\n\n' + '&lt;/textarea&gt; ' +
        '&lt;span class="help-block"&gt;Feel free to change the message and add more information. Please ensure you always provide the link.&lt;/span&gt; &lt;/div&gt; ' +
        '&lt;/div&gt; ' +
        '&lt;div class="form-group requestTypeGroup"&gt; ' +
        '&lt;label class="col-md-4 control-label" for="requestType"&gt;This request is for:&lt;/label&gt; ' +
        '&lt;div class="col-md-4"&gt; &lt;div class="radio"&gt; &lt;label for="Edit"&gt; ' +
        '&lt;input type="radio" name="requestType" id="requestType-0" value="Edit"&gt; ' +
        'Editing &lt;/label&gt; ' +
        '&lt;/div&gt;&lt;div class="radio"&gt; &lt;label for="Delete"&gt; ' +
        '&lt;input type="radio" name="requestType" id="requestType-1" value="Delete"&gt; Deletion&lt;/label&gt; ' +
        '&lt;/div&gt; ' +
        '&lt;/div&gt; &lt;/div&gt;' +
        '&lt;/form&gt; &lt;/div&gt;  &lt;/div&gt;'
    });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="//cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"&gt;&lt;/script&gt;
  &lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" /&gt;
  &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.0/jquery.validate.js"&gt;&lt;/script&gt;
  
  &lt;a data-toggle="contactAdmin" data-title="help" data-url="http:/www.mydomain.com/some-url" href="#"&gt;Contact Web team&lt;/a&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><a href="https://jsfiddle.net/vyaw3ucd/" rel="noreferrer">View on jsFiddle</a></p>