My index.html page is:
<link rel="stylesheet" href="../css/jquery.mobile-1.3.1.min.css">
<link rel="stylesheet" type="text/css" href="../css/style.css" />
<script src="../js/jquery-1.9.1.min.js"></script>
<script src="../js/jquery.mobile-1.3.1.min.js"></script>
<script src="../js/common.js"></script>
<script src="../js/cordova.js"></script>
<script src="../js/jstorage.js"></script>
<script type="text/javascript">
$(document).ready(function(){
loadHeader("YSN Login", false);
});
</script>
</head>
<body>
<!-- Home -->
<div id="header"></div>
<div class="firstDiv"></div>
<div data-role="content">
<form id="loginForm">
<div data-role="fieldcontain">
<label for="textinput6">
Email Address
</label>
<input name="username" id="username" type="text" onkeyup="toggle(this)" value="">
</div>
<span class="ValidationErrors" id="userNameMsg" style="display: none;">Should be a valid Email Id</span>
<div data-role="fieldcontain">
<label for="textinput6">
Password
</label>
<input name="password" id="password" type="password" onkeyup="toggle(this)" value="" class="btn btn-8 btn-8a">
</div>
<span class="ValidationErrors" id="passwordMsg" style="display: none;">Should be a valid password</span>
<a data-role="button" data-theme="b" onclick="loginUser();">
Login
</a>
<div>
<a href ="#" onclick="openSelfWindow('resetPassword.html')" data-transition="fade">
Forget your password?
</a>
</div>
</form>
and my loginUser function which runs on click of login button, I am calling restful web services through ajax
function loginUser(){
var loginData = new Object();
loginData.username = $("#username").val();
loginData.password = $("#password").val();
var loginObj = new function(){
this.url = ysnURL + "userservice/login/user/"
this.data = JSON.stringify(loginData)
this.success = loginSuccess
this.error = loginError
this.beforeSend = validateLoginForm//validates the login form
}
tugnavAjaxPOST(loginObj);
}
function loginSuccess(data){
console.debug(JSON.stringify(data));
stopSpinner();
if(data.success == "true"){
setSession($.parseJSON(data.message));
var ref = openSelfWindow("dashboard.html");
}
else{
showAlert("YSN Login", data.message, function(){});
}
}
function loginError(data){
console.debug(JSON.stringify(data));
stopSpinner();
showAlert("YSN Login", "Error while logging to YSN", function(){});
}
I am ruuning this app on ios simulator, when I click on resetpassword link it takes me to the next page but clicking on login button does not show any alert or in simple words screen remains same.The same code is running properly for android but not for ios,even I have included the cordova.js file for ios then also the problem remains same.
Related
Ideal Case:
if form valid send data to the servlet.
if not show the respective errors
What actually is happening: when i submit a form with wrong credentials the form gets stuck and the data does not go to the servlet which is what we want but when I enter the right credentials even then the form is not being submitted to the servlet. Here is my JavaScript code:
const form = document.getElementById('register-form');
const fname = document.getElementById('fname');
const lname = document.getElementById('lname');
const email = document.getElementById('email');
const password = document.getElementById('password');
const sendData = (fnameVal, sRate, count) => {
if (sRate === count) {
swal("Congratulations " + fnameVal + " !", "Account Created Successfully", "success");
form.submit();
}
}
const successMsg = (fnameVal) => {
let formG = document.getElementsByClassName('form-group');
var count = formG.length - 1;
for (var i = 0; i < formG.length; i++) {
if (formG[i].className === "form-group success") {
var sRate = 0 + i;
sendData(fnameVal, sRate, count);
} else {
return false;
}
}
}
const isEmail = (emailVal) => {
var re = /^\S+#\S+\.\S+$/;
if (!re.test(emailVal)) return false;
var atSymbol = emailVal.indexOf("#");
if (atSymbol < 1) return false;
var dot = emailVal.indexOf('.');
if (dot === emailVal.length - 1) return false;
return true;
}
const isPassword = (passwordVal) => {
var re = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$!%*?&])[A-Za-z\d#$!%*?&]{8,}$/;
if (!re.test(passwordVal)) {
return false;
}
return true;
}
const validate = () => {
const fnameVal = fname.value.trim();
const lnameVal = lname.value.trim();
const emailVal = email.value.trim();
const passwordVal = password.value.trim();
// validate first-name
if (fnameVal.length <= 2) {
setErrorMsg(fname, 'first-name requires min 3 char');
} else {
setSuccessMsg(fname);
}
// check last-name
if (lnameVal.length <= 2) {
setErrorMsg(lname, 'last-name requires min 3 char');
} else {
setSuccessMsg(lname);
}
// check email
if (!isEmail(emailVal)) {
setErrorMsg(email, 'not valide email');
} else {
setSuccessMsg(email);
}
// check password
if (!isPassword(passwordVal)) {
setErrorMsg(password, "min 8 char, at least 1 uppercase and lowercase letter, one number and special character");
} else {
setSuccessMsg(password);
}
successMsg(fnameVal);
}
function setErrorMsg(input, errormsgs) {
const formGroup = input.parentElement;
const small = formGroup.querySelector('small');
formGroup.className = "form-group error";
small.innerText = errormsgs;
}
function setSuccessMsg(input) {
const formGroup = input.parentElement;
formGroup.className = "form-group success";
}
var s = document.getElementById("status").value;
if (s == "success") {
swal("Congratulations", "Account Created Successfully", "success");
}
Here is my HTML code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QuizzBuzz Sign-Up Portal</title>
<link rel="stylesheet" href="./css/registration-style.css">
<!--font-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
</head>
<body>
<input type="hidden" name="hiddenalert" id = "status" value = "<%= request.getAttribute("hiddenalert") %>">
<div class="main">
<section class="signup">
<div class="container">
<div class="signup-content">
<div class="signup-image">
<figure>
<img src="./images/signup-image.jpg" alt="singup-image">
</figure>
</div>
<div class="signup-form">
<h2 class="title">Create an Account</h2>
<form method="post" action="Register" class="register-form" id="register-form">
<div class="form-group">
<select id="userType" class="userType" name="userType" required="required">
<option value="student">Student</option>
<option value="teacher">Teacher</option>
<option value="admin">Admin</option>
</select>
</div>
<div class="form-group">
<input type="text" name="firstname" id="fname" placeholder="Enter your first-name" autocomplete="off" required="required">
<i class="fa-solid fa-circle-check"></i>
<i class="fa-solid fa-exclamation-circle"></i>
<small>Error!</small>
</div>
<div class="form-group">
<input type="text" name="lastname" id="lname" placeholder="Enter your last-name" autocomplete="off" required="required">
<i class="fa-solid fa-circle-check"></i>
<i class="fa-solid fa-exclamation-circle"></i>
<small>Error!</small>
</div>
<div class="form-group">
<input type="email" name="email" id="email" placeholder="Enter your Email ID" autocomplete="off" required="required">
<i class="fa-solid fa-circle-check"></i>
<i class="fa-solid fa-exclamation-circle"></i>
<small>Error!</small>
</div>
<div class="form-group">
<input type="password" name="password" id="password" placeholder="Enter your password" autocomplete="off" required="required">
<i class="fa-solid fa-circle-check"></i>
<i class="fa-solid fa-exclamation-circle"></i>
<small>Error!</small>
</div>
<input type="submit" value="Submit" onclick = "event.preventDefault(); validate()" class="button">
</form>
</div>
</div>
</div>
</section>
</div>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="./js/member-registration.js"></script>
</body>
</html>
I think it has something to do with the event.preventDefault() function but i dont know exactly how to get around the problem and solve it.And the sweet alerts also do not work
I highly recommend you to validate users and passwords formats also in servlets(or server side).
This because people could just erase or stop all javascript validation and directly send their data.
Validating in client side is not wrong but is not secure at all.
Now, answering your request, if the credentials are in a correct format you are just submitting the form tag like this.
<form method="post" action="Register" class="register-form" id="register-form">
The "action" attribute work is redirecting the form content to the url you write in it.
So action="Register" is not correct(If you were reaching a servlet, it have to be a valid path, like: '/Register').
In it's place, you have to write a relative path that is current being listened by a servlet or a jsp, like this:
action="register.jsp" or action="/register"
This way, when you submit your form, it is gonna redirect you and your form content to the path you wrote.
Another way is send data trough ajax(You can research it), the form data is sent without reloading and your javascript recives a response from the server.
Let me know if i helped.
Problem
: getting an error when I try to use firebase.auth to create a new user.
Error
Uncaught TypeError: firebase.auth.createUserWithEmailAndPassword is not a function
What should happen : In my html there is a form for user sign up with email and password. On button click my script takes the input from the sign up form and passes it to firebase.auth however firebase.auth seems to not be available from an external script that is being included into the html file. The html file does have the firebase includes and I can deploy my code into firebase hosting, I already went through the firebase localhost installation process from the firebase docs.
Here is my HTML
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Sign Up</title>
<link href="https://fonts.googleapis.com/css?family=Nunito:300,400,400i,600,700,800,900" rel="stylesheet">
<link href="dist-assets/css/themes/lite-purple.min.css" rel="stylesheet">
<!-- update the version number as needed -->
<script defer src="/__/firebase/7.12.0/firebase-app.js"></script>
<!-- include only the Firebase features as you need -->
<script defer src="/__/firebase/7.12.0/firebase-auth.js"></script>
<script defer src="/__/firebase/7.12.0/firebase-database.js"></script>
<script defer src="/__/firebase/7.12.0/firebase-messaging.js"></script>
<script defer src="/__/firebase/7.12.0/firebase-storage.js"></script>
<!-- initialize the SDK after all desired features are loaded -->
<script defer src="/__/firebase/init.js"></script>
<link href="https://fonts.googleapis.com/css?family=Nunito:300,400,400i,600,700,800,900" rel="stylesheet">
<link href="dist-assets/css/themes/lite-purple.min.css" rel="stylesheet">
</head>
<div class="auth-layout-wrap" style="background-image: url(dist-assets/images/photo-wide-4.jpg)">
<div class="auth-content">
<div class="card o-hidden">
<div class="row">
<div class="col-md-6 text-center" style="background-size: cover;background-image: url(dist-assets/images/photo-long-3.jpg)">
<div class="pl-3 auth-right">
<div class="auth-logo text-center mt-4"><img src="dist-assets/images/car.png" alt=""></div>
<div class="flex-grow-1"></div>
<div class="w-100 mb-4"><a class="btn btn-outline-primary btn-block btn-icon-text btn-rounded" href="/"><i class="i-Mail-with-At-Sign"></i> Sign in with Email</a><a class="btn btn-outline-google btn-block btn-icon-text btn-rounded"><i class="i-Google-Plus"></i> Sign in with Google</a><a class="btn btn-outline-facebook btn-block btn-icon-text btn-rounded"><i class="i-Facebook-2"></i> Sign in with Facebook</a></div>
<div class="flex-grow-1"></div>
</div>
</div>
<div class="col-md-6">
<div class="p-4">
<h1 class="mb-3 text-18">Sign Up</h1>
<form action="">
<div class="form-group">
<label for="username">Your name</label>
<input class="form-control form-control-rounded" id="username" type="text">
</div>
<div class="form-group">
<label for="email">Email address</label>
<input class="form-control form-control-rounded" id="email" type="email">
</div>
<div class="form-group">
<label for="password">Password</label>
<input class="form-control form-control-rounded" id="password" type="password">
</div>
<div class="form-group">
<label for="repassword">Retype password</label>
<input class="form-control form-control-rounded" id="repassword" type="password">
</div>
<button onclick="signUpWithEmail(event)" class="btn btn-primary btn-block btn-rounded mt-3">Sign Up</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
// // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
// // The Firebase SDK is initialized and available here!
//
// firebase.auth().onAuthStateChanged(user => { });
// firebase.database().ref('/path/to/ref').on('value', snapshot => { });
// firebase.messaging().requestPermission().then(() => { });
// firebase.storage().ref('/path/to/ref').getDownloadURL().then(() => { });
//
// // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
try {
let app = firebase.app();
let features = ['auth', 'database', 'messaging', 'storage'].filter(feature => typeof app[feature] === 'function');
const auth = firebase.auth();
console.log(features);
} catch (e) {
console.error(e);
}
});
</script>
<script src="dist-assets/js/app-js/app-dist.js"></script>
And Here is my js
//Sign up with email and password
function signUpWithEmail(e){
e.preventDefault();
var name = document.getElementById("username").value;
var email = document.getElementById("email").value;
var password = document.getElementById("password").value;
var passwordMatch = document.getElementById("repassword").value;
//Create user
auth.createUserWithEmailAndPassword(email, password).then(cred => {
console.log(cred);
})
//Get UID
//Create New Collection identified by UID
//Create user info document
//Add user email and name to user info document
}
I was calling firebase.auth.createUserWithEmailAndPassword()
It should have been firebase.auth().createUserWithEmailAndPassword() which I did do right on my sign in method using auth()..
Yep Im kicking myself right now
I have been doing a tutorial on AngularJS and am stuck on trying to fill this form and have it saved to disk as a json file using the $resource service.
I keep getting the error
Error: ENOENT: no such file or directory, open '/data/event/999.json'
app/NewEvent.html
<!doctype html>
<html lang="en" ng-app="eventsApp">
<head>
<meta charset="utf-8">
<title>Event Registration</title>
<link rel="stylesheet" href="./css/bootstrap.min.css">
<link rel="stylesheet" href="./css/app.css">
</head>
<body>
<div class="container">
<div class="navbar-inner">
<ul class="nav">
<li>Create Event</li>
</ul>
</div>
<style> input.ng-invalid.ng-dirty {background-color:pink}</style>
<div ng-controller="EditEventController" style="padding-left:20px; padding-right:20px">
<div class="container">
<h1>New Event</h1>
<hr>
<form name="newEventForm">
<fieldset>
<label for="eventName">Event Name:</label>
<input id="eventName" type="text" required ng-model="event.name" placeholder="Name of your event ...">
<label for="eventDate"> Event Date</label>
<input id="eventDate" type="text" required ng-pattern="/\d\d/\d\d/\d\d\d\d/" ng-model="event.date" placeholder="format (mm/dd/yyyy)...">
<label for="eventTime">Event Time:</label>
<input id="eventTime" type="text" ng-model="event.time" placeholder="start and end time ...">
<label for="eventLocation"> Event Location</label>
<input id="eventLocation" type="text" ng-model="event.location.address" placeholder="Address of event...">
<br>
<input id="eventCity" type=text" ng-model="event.location.city" class="input-small" placeholder="City...">
<input id="eventProvince" type="text" ng-model="event.location.province" class="input-small" placeholder="Province...">
<label for="eventImageUrl">Image:</label>
<input id="eventImageUrl" type="url" ng-model="event.imageUrl" class="input-xlarge" placeholder="Url of image...">
</fieldset>
<img ng-src="{{event.imageUrl}}" src="">
<br>
<br>
<button type="submit" ng-disabled="newEventForm.$invalid" ng-click="saveEvent(event, newEventForm)" class="btn btn-primary">Save</button>
<button type="button" ng-click="cancelEdit()" class="btn btn-default">Cancel</button>
</form>
</div>
</div>
</div>
<script src="/lib/jquery.min.js"></script>
<script src="/lib/underscore-1.4.4.min.js"></script>
<script src="/lib/bootstrap.min.js"></script>
<script src="/lib/angular/angular.js"></script>
<script src="/lib/angular/angular-resource.js"></script>
<script src="/lib/angular/angular-sanitize.js"></script>
<script src="/js/app.js"></script>
<script src="/js/controllers/EventController.js"></script>
<script src="/js/controllers/EditEventController.js"></script>
<script src="/js/services/EventData.js"></script>
<script src="/js/filters.js"></script>
</body>
</html>
app/js/controllers/EditEventController.js
eventsApp.controller('EditEventController',function EditEventController($scope,eventData) {
$scope.saveEvent = function (event, newEventForm) {
if(newEventForm.$valid){
eventData.save(event)
.$promise.then(
function (response) { console.log('success',response)},
function (response) { console.log('failure',response)}
)
}
}
$scope.cancelEdit = function () {
window.location = "/EventDetails.html";
}
})
app/js/services/EventData.js
eventsApp.factory('eventData', function ($resource) {
return {
getEvent: function() {
return $resource('/data/event/:id.json',{id:'#id'}).get({id:1});
},
save: function (event) {
event.id = 999;
return $resource('/data/event/:id',{id:'#id'}).save(event);
}
}
})
scripts/eventsController.js
var fs = require('fs')
module.exports.get = function (req,res) {
var event = fs.readFileSync('/data/event/' + req.params.id ,'utf8');
res.setHeader('Content-Type','application/json');
res.send(event)
}
module.exports.save = function (req,res) {
var event = req.body;
fs.writeFileSync('/data/event/' + req.params.id +'.json', JSON.stringify(event));
res.send(event)
}
scripts and app are on the same level
EventDetails.html is inside app and in the same level as NewEvent.html
At first glance the code looks correct, could this maybe be a permission problem?
I have a form and I'm doing some validation JavaScript before send it to PHP, and the JavaScript function after validation post the text the user entered in a <p> tag at the bottom of the page; However, this message displays briefly and then disappears...
How can I make the message stay in the page, and send the rest of data to a PHP script?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Contact Us</title>
<!-- Bootstrap -->
<link href="bootstrap.min.css" rel="stylesheet">
<!-- stylesheet for this form -->
<link href="contact-stylesheet.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script type="text/javascript">
function validateForm() {
var message = "";
var letters = /^[A-Za-z]+$/;
var name = document.forms["myForm"]["name"].value;
var email = document.forms["myForm"]["email"].value;
var subject = document.forms["myForm"]["subject"].value;
var text = document.forms["myForm"]["text"].value;
var outputMsg = "";
if (name == null || name == "") {
message += "name field missing!\n";
}
if (name != "" && !name.match(letters)) {
message += "Invalid name: only letters allowed!\n";
}
if (subject == null || subject == "") {
message += "Subject field is empty!\n";
}
if (text == null || text == "") {
message += "Text field is empty!\n";
}
if (message != "" ) {
alert(message);
return false;
}
outputMsg = "Message Sent!....\n" +
"Name: " + name + "\n" +
"Email: " + email + "\n" +
"Subject: " + subject + "\n" +
"Text: " + text + "\n";
document.getElementById("msg-result").innerHTML = outputMsg;
return true;
}
</script>
</head>
<body>
<div class="row">
<div class="hero-unit" style="padding:20px 100px">
<h1>Contact Us</h1>
<p>aldkfjasdkfjaskdfasdfkasdkfjadsfjsdkfjaskfjasdkfjasjfaskdfjsdkfjsksdsdkjsd</p>
</div>
<div class="col-sm-6">
<div class="my-form">
<form class="form-horizontal" name="myForm" action="" onsubmit="validateForm()" method="post">
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">Name:</label>
<div class="col-sm-8">
<input type="name" name="name" class="form-control" id="inputEmail3" placeholder="Name">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Email:</label>
<div class="col-sm-8">
<input type="email" name="email" class="form-control" id="inputPassword3" placeholder="Email">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Subject:</label>
<div class="col-sm-8">
<input type="text" name="subject" class="form-control" placeholder="Subject">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Text:</label>
<div class="col-sm-8">
<textarea name="text" class="form-control" rows="7" placeholder="Text"></textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Send</button>
</div>
</div>
</div>
</form>
</div>
<div class="col-sm-6">
<div style="width:500px;heigth:350px;border:solid 1px brown">
<h1>GOOGLE MAP HERE!</h1>
</div>
<!-- <img sytle="padding:0px 20px" src="https://maps.googleapis.com/maps/api/staticmap?center=Miami+Downtown,Miami,FL&zoom=13&size=500x350&maptype=roadmap&markers=color:red%7CMiami+Downtown,Miami,FL"> -->
</div>
</div>
<div class="col-sm-6" style="padding:10px 140px">
<p id="msg-result"></p>
<!-- display form result message here! -->
</div>
<!--
Welcome <?php echo $_POST["name"]; ?><br>
Your email address is: <?php echo $_POST["email"]; ?>
-->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
It's because you are updating the text in the field and then submitting to php (wiping out all of the fields since the page refreshes). You could set hidden elements to hold the values that you want to display so they post over to php and then you can just echo them where you want them to be. Another way of doing it would be to make an ajax call to a php to do your updating instead of posting back to the same page.
So with ajax you would do something like:
formSubmit()
{
//do validation
//do a jquery post to a php page
$.ajax
({
type: "POST",
//the url of the php page
url: 'test.php',
dataType: 'json',
async: false,
//json object to sent to the authentication url
data: '{"test": "info"}',
success: function (result) {
//update stuff
}
})
return false;
}
I think the form is submitted after the check. You must return the result (to cancel the submit if validateForm() is false):
onsubmit="return validateForm();"
or prevent default:
onsubmit="return validateForm(event);"
with
function validateForm(event) {
...
event.preventDefault();
I am working with js and jquery. I have a test login page I'm working on and seem to be having trouble with the bind on the login button. In Chrome i see that the js file is loading, but when you click on the button it just refreshes the page. It doesn't show the alert section or shake if you enter the incorrect info, and it doesn't redirect to the main page if you enter the correct info. Here is my code:
HTML:
<body>
<div id="content">
<section class="ui-widget ui-corner-all">
<header class="ui-widget-header ui-corner-top">
Test Login
</header>
<div class="ui-widget-content ui-corner-bottom">
<p class="ui-state-error">Uername / Password Incorrect.</p>
<form>
<div>
<label for="username">Username:</label>
<input id="username" type="text">
</div>
<div>
<label for="password">Password:</label>
<input id="password" type="password">
</div>
<div>
<input id="btnLogin" type="submit" value="Login">
</div>
</form>
</div>
</section>
</div>
<div class="ui-widget-overlay" style"z-index: 1002;"> </div>
</body>
JS:
$(".ui-state-error").hide();
$("#btnLogin").button()
.bind ("click", function() {
if($("#username").val() != "test" && $("#password").val() != "test") {
$(".ui-state-error").show();
$("#login section").effect("shake", 150);
}
else {
document.location = 'index.html';
}
return false;
});
Try this
$(function(){
$("#btnLogin").button().bind ("click", function() {
if($("#username").val() != "test" && $("#password").val() != "test") {
$(".ui-state-error").show();
$("#login section").effect("shake", 150);
}
else {
document.location = 'index.html';
}
return false;
});
});
check this:
http://jsfiddle.net/Q5YeX/
I think you are not referencing the right jquery UI lib or your are referencing it the wrong way