title: validating user input inside modal popup using jquery validation plugin
body: <p>I am trying to validate user input in a jquery UI modal dialog.
  Jquery validation plugin is used for validation.</p>
  
  <p>trying to verify validation in popup button click</p>
  
  <pre><code>&lt;form id="frm"&gt;
      &lt;div&gt;
          &lt;button name="btn" id="btn" type="button" &gt;OpneModal&lt;/button&gt;
      &lt;div id="dlg" style="display:none"&gt;
          &lt;div&gt;
              Name: &lt;input type="text" id="txtName" name="txtName"/&gt;
          &lt;/div&gt;
          &lt;div&gt;
          &lt;/div&gt;
          &lt;/div&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  
  
   $(
       function () {
             var rules = {
              txtName: {
                  required: true
              }
          };
          var messages = {
              txtName: {
                  required: "Please enter name"
              }
          };
         $("#frm").validate({rules:rules, messages:messages});
  
  
            $("#btn").click(
                function () {
  
                    $("#dlg").dialog(
                        {
                            modal: true,
                            buttons: {
                                "Save": function () {
                                  alert(  $("#frm").valid());
                                },
                                "Cancel": function () {
                                    $("#dlg").dialog("close");
                }
                            }
  
                        }
                        );
                }
                );
  
        });
  </code></pre>
  
  <p>But the validation is always success.</p>
  
  <p>code is in js fiddle: <a href="http://jsfiddle.net/aGJrZ/6/" rel="nofollow">http://jsfiddle.net/aGJrZ/6/</a></p>