Showing error message within a dynamic CSS dropdown
I have a login dropdown much like Twitter. You can check it out here http://mashup2.sunnydsouza.com/index3.php
Currently am using JQuery validation plugin to check whether the username/pass fields are entered before clicking submit. What I want is that if a user enters an incorrect username/password, the error login message should come within the dropdown itself, under the password field, without reloading the entire page again
But when user enters correct username/password, the page would refresh and the 'Sign In' would now replace with the username of the user entered (that will a dropdown too, with Control panel,logout options etc)
Can someone please help me out with this? How to do it in jQuery?
EDIT:
Following is the dropdown code
<fieldset id="signin_menu">
<form method="post" id="signin" action="index3.php">
<label for="username">Username or email</label>
<input id="username" name="username" value="" title="username" class = "required" tabindex="4" type="text">
</p>
<p>
<label for="password">Password</label>
<input id="password" name="password" value="" title="password" tabindex="5" class="required" type="password">
</p>
开发者_如何学Go <p class="remember">
<input id="signin_submit" value="Sign in" tabindex="6" type="submit" name="user_login">
<input id="remember" name="remember_me" value="1" tabindex="7" type="checkbox">
<label for="remember">Remember me</label>
</p>
<p class="forgot"> <a href="#" id="resend_password_link">Forgot your password?</a> </p>
<p class="forgot-username"> <A id=forgot_username_link title="If you remember your password, try logging in with your email" href="#">Forgot your username?</A> </p>
</form>
</fieldset>
I want that when user enters an invalid username/password, an error message appears within this dropdown itself
So you can add a "required" class to both input fields, then hook some code like this:
var $form = $("#signin");
$form.validate();
$form.submit(function() {
if (!$form.valid()) {
return false;
}});
精彩评论