A CodePen by iw3. jQuery UI Dialog + validate

index.html

<input id="openButton" type="button" value="Open" />
<div id="dialog">
  <form id="form">
    <input type="text" id="name" name="name" />
    <input type="text" id="pinCode" name="pinCode" />
  </form>
</div>

script.js

$(function () {
  $('#dialog').dialog({
    autoOpen: false,
    buttons: {
      'Send': function() {
        console.debug('valid():' + $('#form').valid());
        if ($('#form').valid()) {
          alert('Success');
          $('#dialog').dialog('close');
        }
      }
    }
  });
  $('#openButton').on('click', function() {
    $('#dialog').dialog('open');
  });
  $('#form').validate({
    rules: {
      pinCode: {
        required: true,
        digits: true,
        maxlength: 9,
        min: 1
      }
    }
  });
});