验证登录&使用jquery validate plugin重定向到成功页面 [英] validate login & redirect to success page using jquery validate plugin
问题描述
我是新手来提升jQuery脚本的水平，我在这里使用jquery验证我的登录页面。
I am new to advance level of jQuery scripting and here I am using jquery validation for my login page.
如果我的登录页面成功，则必须重定向到成功页面，当我单击提交按钮时，代码与下面的代码工作正常。
If my login page was success it has to redirect to success page the code was working fine with the below code when I click submit button .
<form id="form1" name="login" method="post" action="mainpage.html">
</form>
这是我的代码
$(function (){
$("#form1").validate({
// Specify the validation rules
rules: {
username: {
required: true,
email: true
},
password: {
required: true,
minlength: 5
}
},
// Specify the validation error messages
messages: {
username: "Please enter a valid email address",
password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long"
},
submitHandler: function (form) { // for demo
$('#username').focus();
$('#submit').click(function () {
event.preventDefault(); // prevent PageReLoad
var ValEmail = $('#username').val() === 'admin@admin.com'; // Email Value
alert("Email" + ValEmail);
var ValPassword = $('#password').val() === 'admin1234'; // Password Value
if (ValEmail === true && ValPassword === true) { // if ValEmail & Val ValPass are as above
alert('valid!'); // alert valid!
window.location.href = "http://java67.blogspot.com";
// go to home.html
}
else {
alert('not valid!'); // alert not valid!
}
});
}
}
});
});
但是如果emailid = admin@admin.com& ;,我需要做验证示例。 passsword = admin1234当我点击提交时需要检查我的emailid是否为John@xyz.com，如果两者都成功则密码是密码，必须重定向，否则必须在标签中显示错误信息。
But I need to do validation example if emailid = admin@admin.com & passsword = admin1234 when I click the submit it needs to check whether my emailid was John@xyz.com and passsword was password if both was successful it has to redirect, else it has to show error message in the label.
现在我收到错误，因为HTTP错误405.0 - 方法不允许
Now I am getting the error as HTTP Error 405.0 - Method Not Allowed
这是小提琴链接
提前致谢
问候
M
推荐答案
您的代码因以下原因而被破坏......
Your code is broken for the following reasons...
1）您错误地在消息中放置了选项。 success 选项成功选项是 sibling 消息，而不是孩子。
1) You've incorrectly placed the success option inside of the messages option. The success option is a sibling of messages, not a child.
messages: {
username: "Please enter a valid email address",
password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long"
},
success: function (data) { // <- does not belong inside of 'messages' option
....
}
}
2）根据文件，成功选项适用于：如果指定，则显示错误标签以显示有效元素。换句话说，仅使用 success 如果您希望在没有错误时也显示错误标签;比如绿色的复选标记效果。
2) As per documentation, the success options is for: "If specified, the error label is displayed to show a valid element." In other words, only use success if you want the error label to also be shown when there is no error; like for a green checkmark effect.
3）你的成功功能与预期目的无关。 成功选项。如果要手动编写验证函数，使用验证插件有什么意义？请参阅我的评论。
3) Your success function has nothing to do with the intended purpose of the success option. What's the point of using a validation plugin if you're going to manually write a validation function? See my comments.
success: function (data) {
if (username == 'john@xyz.com' && password == password) { // this is what the plugin does automatically when it evaluates the rules
window.location = "mainpage.html"; // this is already the 'action' part of your '<form>'
}
else {
$('#username').focus(); // Again, the plugin already does this.
}
}
只需让插件按设计运行......
Simply let the plugin operate as designed...
-
当验证失败时，您将收到一条消息，该字段将成为焦点。
When validation fails, you'll get a message and the field will come into focus.
验证通过后，表单将提交并重定向到操作指定的 mainpage.html URL =mainpage.html< form> 的属性。
When validation passes, the form will submit and redirect to the mainpage.html URL as specified by the action="mainpage.html" attribute of your <form>.
您的jsFiddle已更新...
Your jsFiddle updated...
http://jsfiddle.net/sparky672/ny9bt1ak/3/
这篇关于验证登录&使用jquery validate plugin重定向到成功页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
