title: How to get the input values from a jQuery popup window
body: <p>i had created a jquery popup window for login box.it contains the fields of email &amp; password.i want to get the input values entered in jquery popup for checking the username &amp; password with mysql db. iam not able to get the values from popup.</p>
  
  <p>can any one suggest me to get out from this??</p>
  
  <p>My HTML code:</p>
  
  <pre><code>&lt;div class="login-box"&gt;&lt;a href="#login-box" class="login-window"&gt;Login&lt;/a&gt;&lt;/div&gt;
  
  &lt;div id="login-box" class="login-popup"&gt;
    &lt;a href="#" class="close"&gt;&lt;img src="close_pop.png" class="btn_close" title="Close Window" alt="Close" /&gt;&lt;/a&gt;
    &lt;form method="post" class="signin" id="sign" action="" &gt;
      &lt;fieldset class="textbox"&gt;
        &lt;label class="username"&gt;
          &lt;!-- &lt;span&gt;Username or email&lt;/span&gt;--&gt;
          &lt;input id="username" name="username" value="" type="text" autocomplete="on" placeholder="Email"&gt;
        &lt;/label&gt;
  
        &lt;label class="password"&gt;
          &lt;!--   &lt;span&gt;Password&lt;/span&gt;--&gt;
          &lt;input id="password" name="password" value="" type="password" placeholder="Password"&gt;
        &lt;/label&gt;
        &lt;div class="clear"&gt;&lt;/div&gt;
        &lt;button class="submit button" type="button" name="submit" &gt;Login&lt;/button&gt;
  
        &lt;p class="forgot"&gt;&lt;a  href="#"&gt;Forgot your password?&lt;/a&gt;&lt;/p&gt;
      &lt;/fieldset&gt;
    &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My jQuery code:</p>
  
  <pre><code>$(document).ready(function() {
      $('a.login-window').click(function() {
  
          // Getting the variable's value from a link 
          var loginBox = $(this).attr('href');
  
          //Fade in the Popup and add close button
          $(loginBox).fadeIn(300);
  
          //Set the center alignment padding + border
          var popMargTop = ($(loginBox).height() + 24) / 2; 
          var popMargLeft = ($(loginBox).width() + 24) / 2; 
  
          $(loginBox).css({ 
              'margin-top' : -popMargTop,
              'margin-left' : -popMargLeft
          });
  
          // Add the mask to body
          $('body').append('&lt;div id="mask"&gt;&lt;/div&gt;');
          $('#mask').fadeIn(300);
  
          return false;
      });
  
      // When clicking on the button close or the mask layer the popup closed
      $('a.close, #mask').live('click', function() { 
          $('#mask , .login-popup').fadeOut(300 , function() {
              $('#mask').remove();  
          }); 
          return false;
      });
  });
  </code></pre>