我正在使用工具提示验证表单并使用警告消息对后端响应执行ajax调用。虽然我正在验证我正在使用表单ID进行ajax调用和工具提示验证。所以我的问题是,即使我得到空文本验证并进入ajax成功调用。如何将工具提示与ajax调用结合起来。
script.
$(document).ready
console.log('bbbbbbbb');
$('#loginform').submit(function(e) {
console.log('submit called');
var data = {};
data.email = $('#username').val();
data.password = $('#password').val();
JSON.stringify(data);
console.log(data);
$.ajax({
url: "/login",
type: "POST",
dataType: 'json',
data: JSON.stringify({ "objectData": data}),
contentType: "application/json",
success: function(data) {
alert('SUCCESS":'+JSON.stringify(data));
var successVar = data;
alert(successVar.data);
if(successVar.data == "Invalid username And Password"){
showfailure();
}
if(successVar.data == "Login successfully"){
showdiv();
location.href='http://localhost:3000/landing';
}
},
});
return false;
});
$('#loginform').click(function(){
loginValidation();
});
function loginValidation(){
$('#loginform').validate({
rules : {
email_id : {
minlength : 5,
required : true,
email : true
},
password : {
minlength : 5,
required : true
}
},
messages : {
email : "Enter Valid Email Address.",
password : "Enter Password"
}
});
}
Login form:
.middle
.container
#login-modal.modal.fade(tabindex='-1', role='dialog', aria-labelledby='myModalLabel', aria-hidden='true')
.modal-dialog
.modal-content(style='margin-top:120px;')
.modal-header.login_modal_header
button.close(type='button', data-dismiss='modal', aria-hidden='true') ×
h2#myModalLabel.modal-title Sign In
.modal-body.login-modal
.clearfix
#social-icons-conatainer
.modal-body-left
form#loginform(method="#",action="#")
.form-group
input#username.form-control.login-field(type='email', name='email_id', value='', data-placement='bottom' placeholder='Email Id',
maxlength='25',title="Enter your email address here", required)
i.fa.fa-envelope.login-field-icon
.form-group
input#password.form-control.login-field(type='password', name='password', value='',data-placement='bottom', placeholder='Password',
maxlength='15',title="Enter your password here",required)
i.fa.fa-lock.login-field-icon
#loginSuccess.alert.alert-success(style='display:none')
a.close(href='#', data-dismiss='alert') ×
strong Success!
| Login successfully.
#loginFailure.alert.alert-danger(style='display:none')
a.close(href='#', data-dismiss='alert') ×
strong Failed!
| Invalid Username and Password.
button#loginbtn.btn.btn-success.modal-login-btn.color(type="submit") Sign In
p Having trouble sign in? <a href="#forgot-modal", class="form-signin-link.login", data-toggle="modal", data-target="#forgot-modal"> Click Here </a>
.modal-body-right
.modal-social-icons
a.btn.btn-default.facebook(href='#')
i.fa.fa-facebook.modal-icons
| Sign In with Facebook
a.btn.btn-default.google(href='/auth/google')
i.fa.fa-google-plus.modal-icons
| Sign In with Google
#center-line OR
.clearfix
.form-group.modal-register-btn
p Don't have an account? <a href="#signup-modal", data-toggle="modal", data-target="#signup-modal"> Create an Account </a>
.clearfix
.modal-footer.login_modal_footer
My call:
exports.login = function(req, res) {
console.log("enter the login999999999");
console.log(req.body);
var resultObject = (req.body.objectData);
client.query("SELECT * FROM login where email_id='" + resultObject.email + "' AND password='" + resultObject.password + "'", function(err, result) {
console.log("Row count: %d",result.rows.length); // n
if(result.rows.length>0){
console.log('successfully');
res.send({data:"Login successfully"});
} else {
console.log('not successfully');
res.send({data:"Invalid username And Password"});
}
});
};
答案 0 :(得分:1)
script.
$(document).ready
console.log('bbbbbbbb');
$('#loginform').validate({
rules : {
email_id : {
minlength : 5,
required : true,
email : true
},
password : {
minlength : 5,
required : true
}
},
messages : {
email : "Enter Valid Email Address.",
password : "Enter Password"
},
submitHandler: function (form) {
alert('submit');
var data = {};
data.email = $('#username').val();
data.password = $('#password').val();
JSON.stringify(data);
console.log(data);
$.ajax({
url: "/login",
type: "POST",
dataType: 'json',
data: JSON.stringify({ "objectData": data}),
contentType: "application/json",
success: function(data) {
alert('SUCCESS":'+JSON.stringify(data));
var successVar = data;
alert(successVar.data);
if(successVar.data == "Invalid username And Password"){
showfailure();
}
if(successVar.data == "Login successfully"){
showdiv();
location.href='http://localhost:3000/landing';
}
},
});
return false;
}
});
function showdiv()
{
document.getElementById("loginFailure").style.display="none";
document.getElementById("loginSuccess").style.display="block";
}
function showfailure()
{
document.getElementById("loginFailure").style.display="block";
}