JavaScript Load New Page Question - javascript

What I am looking to do is if a user complete a form it will provide access to a new location.
<script language="JavaScript" type="text/javascript">
<!--
function validateForm(theForm) {
var firstname = theForm.firstname.value;
var lastname = theForm.lastname.value;
var email = theForm.email.value;
if (firstname == "") {
alert("Please fill in your First Name.");
theForm.firstname.focus();
return false;
}
if (lastname == "") {
alert("Please fill in your Last Name.");
theForm.lastname.focus();
return false;
}
if (email == "") {
alert("Please fill in your email address.");
theForm.email.focus();
return false;
}
return true;
}
I know this part is wrong but I have no idea how to go about doing it. any help would be nice..
if lastname=""
if firstname=""
if email=""
load('www.google.com');

if (validateForm(theForm)) window.location = 'http://www.google.com';
Is equivalent to using
if (validateForm(theForm)) window.location.href = 'http://www.google.com';
Both will work, so choose which one you prefer.

if lastname=""
if firstname=""
if email=""
load('www.google.com');
becomes
if ((lastname == "") && (firstname == "") && (email == "")) {
window.location = "http://www.google.com";
}

Related

Javascript string comparison not detected

Sure this is a simple problem but I am new to this. Am trying to develop a simple website for a user to work out a password and then if they get it right, take them to a congrats screen where they win a prize. However my if statement is not working in the code below
<script>
function CheckPassword() {
var pword = document.getElementById("inpPassword").value;
if (pword == ""|| pword == NULL) {
alert("Please enter a password");
} else if (pword == 'newman') {
window.open('congratulations.html', '_self');
} else {
alert("Wrong password");
}
}
</script>
If I add an alert with the pword value then it prints out correctly what was entered. However the code picks up when the password input is blank, however if the input field is not blank then it does not go to the other screen or show the wrong password alert box. I have tried it with an alert box saying correct instead of the link to the new page but still did not work. Also tried using String(pword) in case that was the problem. Am sure this is a simple solution but just can't see it.
Thanks
function CheckPassword() {
var pword = document.getElementById("inpPassword").value;
if (pword == ""|| pword == null){
alert("Please enter a password");
}
else if (pword == 'newman') {
window.open('congratulations.html', '_self');
}
else
{
alert("Wrong password");
}
}
<input type='password' id='inpPassword'>
<input type='button' onclick='CheckPassword()'>
if (pword == "" || pword == null) , its null not NULL . keywords are case sensitive.
You should use null instead of NULL. Seems like it works besides of opening new window, because there is no congratulations.html in my snippet:
function CheckPassword() {
var pword = document.getElementById("inpPassword").value;
if (pword == ""|| pword == null){
alert("Please enter a password");
}
else if (pword == 'newman') {
window.open('congratulations.html', '_self');
}
else
{
alert("Wrong password");
}
}
<input id="inpPassword">
<button onclick="CheckPassword()">Click</button>
You may try here:
The mistake was here, you wrote NULL instead of null, beacuse of javascript understand null as a reserve keyword.
And use === for hard checking(data as well type checking of variaable)
function CheckPassword() {
var pword = document.getElementById("inpPassword").value;
if (pword == ""|| pword == null){
alert("Please enter a password");
}
else if (pword === 'newman') {
alert('congratulations.html', '_self');
}
else
{
alert("Wrong password");
}
}
<input type="" name="a" id="inpPassword">
<input type="button" onClick="CheckPassword()" value="check">
It seems the problem is when you compare to NULL. If you check your browser console you will likely get the following error:
Uncaught ReferenceError: NULL is not defined
That is not the correct syntax for null checks, it will look for a variable called "NULL" which you don't have. You should use null (lowercase) instead:
if (pword == ""|| pword == null){
The full adjusted code is as follows:
function CheckPassword() {
var pword = document.getElementById("inpPassword").value;
if (pword == ""|| pword == null) {
alert("Please enter a password");
} else if (pword == 'newman') {
window.open('congratulations.html', '_self');
} else {
alert("Wrong password");
}
}
Here is a working example.
Null, "" are equivalent to false in Javascript. You just have to:
if (!pword) {
alert("Please enter a password");
} else if (pword === 'newman'){
window.open('congratulations.html', '_self');
} else {
alert("Wrong password");
}
you can write null in small case so its work
function CheckPassword() {
var pword = document.getElementById("inpPassword").value;
if (pword == "" || pword == null ) {
alert("Please enter a password");
} else if (pword == 'newman') {
window.open('congratulations.html', '_self');
} else {
alert("Wrong password");
}
}
<input id="inpPassword" onblur="CheckPassword()">

Clearing specific fields (not all) when a form is submitted

Im trying to clear only the password and confirm password fields when those are not matched.
Im calling a function when the submit button is pressed which contains a password checking condition. How should I clear only password and confirmpassword inputs if that condition is true?
function checkmatch()
{
var name = $("#username").val();
var address = $("#address").val();
var email = $("#emailid").val();
var mobile = $("#phonenum").val();
var password = $("#newPwd").val();
var cnfirmPassword = $("#confirmPwd").val();
if(password != cnfirmPassword)
{
alert("Passwords do not match.");
return false;
}
else if((name==null || name == "") || (address==null || address == "") || (email==null || email == "") || (mobile=null || mobile == "") || (password==null || password == "") || (cnfirmPassword==null || cnfirmPassword == ""))
{
alert("Please fill all the required fields.");
return false;
}
else
{
$.ajax(
{
type: "POST",
url: "assmt1.php",
datatype: "html",
data: $("#fm1").serialize(),
success: function(response)
{
}
});
alert("Your form has been submitted. Thank you!");
}
}
Is this what you mean?
var password = $("#newPwd").val();
var cnfirmPassword = $("#confirmPwd").val();
if(password != cnfirmPassword)
{
alert("Passwords do not match.");
$("#newPwd").val('').focus(); ///this will not focus because of alert
$("#confirmPwd").val('');
return false;
}
All you need to do is call the same function you used to get the value.
Just pass empty string to val() like so:
$("#newPwd").val('');
$("#confirmPwd").val('');

How to call the next page after button login clicked in XDK

In my login script when the username and password are both correct it must go to the next page (main/menu page) of the intel XDK.
My problem is how or what code can I use to call the next page whenever the username and password is correct (login successful)?
function validateForm() {
var formUsername = document.forms.login.username.value;
var formPassword = document.forms.login.password.value;
var MINLENGTH = 5;
// Validate username and password
if (formUsername === null || formUsername === "") {
alert("Username must be filled out");
}
else if (formPassword === null || formPassword === "") {
alert("Password must be filled out");
}
else if (formUsername.length < MINLENGTH || formPassword.length < MINLENGTH) {
alert("The minimum length of username and password at least " + MINLENGTH);
}
else if(formUsername == 'admin' && formPassword == 'admin'){
alert('welcome');
//this is where should i put the code to go at the next page of the XDK API.
return;
}
alert("Login failed!!!");
}
got it guys..
it will be.. like this ..
else if(formUsername == 'admin' && formPassword == 'admin'){
alert('welcome');
activated_page("#menu");
return;
}

javascript onsubmit function not working for two input fields

I am trying to validate a form without using html5 validation as an exercise for a class, but I can't figure it out for the life of me.
I want to have an alert message pop up if the email and/or name is not valid/empty.
I have gotten to the point where the alert will pop up form the email OR the name field, depending which is first in the onsubmit function.
Any ideas would be greatly appreciated!
document.getElementById("frmContact").onsubmit = function() {
var inputEmail= document.getElementById("email").value,
emailPattern = new RegExp("^[A-Za-z0-9._%+-]+#[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$");
if (inputEmail==="") {
alert("Please enter your email.")
return false;
} else if (!emailPattern.test(inputEmail)){
alert("Please enter a valid email address.");
return false;
} else {
return true;
};
var inputName= document.getElementById("name").value,
namePattern = new RegExp("^[A-Za-z]+$");
if (inputName==="") {
alert("Please enter your name.")
return false;
} else if (!namePattern.test(inputName)){
alert("Please enter a valid name.");
return false;
} else {
return true;
};
};
You return after the first one is validated, so the second field is never checked. Instead, have a local variable that is set to true by default, and set to false of either of the fields fail validation, and return it at the end.
var valid = true;
// ...
if(inputEmail==="") {
alert("Please enter your email.");
valid = false;
// ...
return valid;
};
Maybe this doesn't work but the concept could be something like this...
document.getElementById("frmContact").onsubmit = function() {
var inputEmail= document.getElementById("email").value,
emailPattern = new RegExp("^[A-Za-z0-9._%+-]+#[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$"),
error = [],
i = 0;
if (inputEmail==="") {
error.push("Please enter your email");
} else if (!emailPattern.test(inputEmail)){
error.push("Please enter a valid email address.");
}
var inputName= document.getElementById("name").value,
namePattern = new RegExp("^[A-Za-z]+$");
if (inputName==="") {
error.push("Please enter your name.")
} else if (!namePattern.test(inputName)){
error.push("Please enter a valid name.");
}
if(typeof error !== 'undefined' && error.length > 0){
alert("you submit the form correctly");
} else {
for(i = 0; i < error.length; i + 1){
alert(error[i]);
}
}
};

How to validate CAPTCHA correctly in JavaScript?

I'm in the middle of coding CAPTCHA in JavaScript, and I'm trying to get the validation for a contact form to work properly. I'm almost there, the form won't be submitted until the CAPTCHA text-field is entered, but the problem is I'm still getting an error message when I entered the CAPTCHA code correctly.
<script>
function ValidateContactForm()
{
var name = document.ContactForm.name;
var phone = document.ContactForm.phone;
var code = document.ContactForm.code;
if (name.value == "")
{
window.alert("Please enter your name.");
name.focus();
return false;
}
if (phone.value == "")
{
window.alert("Please enter a valid phone number..");
phone.focus();
return false;
}
if (code.value == "")
{
window.alert("Please enter the code as displayed on screen.");
code.focus();
return false;
}
else if (code.value != "")
{
window.alert("Your code does not match. Please try again.");
code.focus();
return false;
}
else {
return true;
}
return true;
}
</script>
Any help would be greatly appreciated. Thanks.
Check this lines, the problem is here:
if (code.value == "")
{
window.alert("Please enter the code as displayed on screen.");
code.focus();
return false;
}
else if (code.value != "")
{
window.alert("Your code does not match. Please try again.");
^^^^^^^^^^^^^
code.focus();
^^^^^^^^^^^^^
return false;
^^^^^^^^^^^^^
}
else {
return true;
}
This code will return false every time.

Categories

Resources