Validating a contact form with javascript? - javascript

I have a contact form that I'm going to validate with JS.
I want a function to loop through all the inputs and work out which one is the email by searching it for a '#' symbol, then assigning it to a variable to be handled later.
I've initialized variables for each input box and assigned them as values in the input array.
I've looped through them and checked them against a regular expression (a simple a-z letter check), just to make sure they've all had content inputted.
If they match the RegExp then I want them to be passed to a string search to look for an # symbol to determine which one is the email input.
This is my code below but it's not working.
Can anyone tell me where i've gone wrong?
Thanks!
var emailaddress;
function find_email() {
var name = document.getElementById("username");
var email = document.getElementById("email");
var msg = document.getElementById("messagecontent");
var racenum = document.getElementById("racenum");
var input = [name, email, racenum, msg];
for (i = 0; i <= input.length; i++) {
var standard_check = /[a-zA-Z0-9]/g;
if (input[i].value.match(standard_check)) {
var str = input[i].value;
str.search("#");
if (str.match("#")) {
emailaddress= str;
}
}
}
}

The Problem with this code is that you have for (i = 0; i <= input.length; i++) which attempts to go one pass the number of elements in the array. Get rid of the equals making it for (i = 0; i < input.length; i++) and you should be fine.

Related

Parse get query string and use value to change check box state

I am new to javascript and I am trying to change the state of check boxes by checking for their id in get query string values. For example, if we have the following url http://localhost/aasd/index.php?category[]=74, I want to change the checkbox with id 74 to be checked.
I am trying to do it with the code below but it's not working
$(document).ready(function() {
var query = window.location.search.substring(1);
var vars = query.split('&');
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split('=');
document.getElementById(pair[1]).checked = true;
}
pair[1] produces undefined74 I cant change check box state with that. I need to pass 74 to document.getElementById(pair[1]).checked = true;for the check box to be checked.
Any help would be appreciated
try this.. did it with an assumptions that url will have only one parameter.
$(document).ready(function() {
var url = window.location.href;
document.getElementById(url.substr(url.indexOf('=') + 1)).checked = true;
});
Check out this code:
$(document).ready(function() {
qsArray = new Array();
var query = "http://localhost/aasd/index.php?category[]=74";
var vars = query.split('&');
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split('=');
$("#"+pair[1]).attr("checked",true); // this will make the checkbox checked when it encounters check box with id 74 I have created a check box with id 74 in my jsfiddle
}
});
Link to fiddle: https://jsfiddle.net/d5wbo91m/2/

Javascript: Traversing through array and accessing its various elements?

Essentially what I'm trying to do right now is, given some input text, I split it up by white space and display on a
div id= "animation"
Every time a button is clicked, the array should go forward one word.
This is my current attempt.
function displayText() {
var displayText = document.getElementbyID("animation");
var list = (document.getElementbyID("input").split(/[ \tn]+/);
for (var i = 0; i < list.length; i++) {
displayText.innerHTML = list.get[i];
}
}
Is my thought process somewhat correct? For whatever reason, it doesn't seem to be working.
there are multiple issues in your method
function displayText() {
var displayTextAnimation = document.getElementbyID("animation"); //keep variable name and method name different
var list = (document.getElementbyID("input").value).split(/[ \tn]+/); //use value property and observe extra bracket
for (var i = 0; i < list.length; i++) {
displayTextAnimation.innerHTML = list.charAt(i); //observe replacing get by charAt
}
}

How to split a comma separated string from user input

I want to be able to have the user list things in an input box (comes up via an alert) and then once submitted have those options replace the default text in the string. They need to be separated after each comma as well and with each thing listed, the loop should paste the text into it when it runs, and repeat with the rest in the list.
Is this possible?
This is what I'm working on right now: http://jsbin.com/nivah/1 and it'll only allow you to type in one thing. Because if you type in several options with commas it includes the commas and all the options in the link which obviously won't return anything.
Here's my javascript code.
var link0='http://www.twitter.com/';
var user=['bob', 'joe', 'tony'];
var user = prompt("I want to message:", user);
var link3=".tumblr.com";
var iframe = document.getElementById("username");
var opt = (link0 + user + link3);
var el = document.createElement("iframe");
for(var i = 0; i < user.length; i++) {
el.setAttribute("src", opt);
iframe.appendChild(el);
}
var array = user.split(',');
Anyone know what I am doing wrong?
I had it working before to repeat the loop based on what i submitted but it was doing it by make each letter of the word its own link in the iframes. Which is not what I want, but as close as I've ever gotten to the loop interaction with the user inputted text.
You need to use the split() but at the right place in your code. Also, your logic is not going to work, You need to create each iframe within the for loop, something like this -
WORKING DEMO - http://jsbin.com/ciquvatu/1/edit
var link0='http://www.tumblr.com/ask_form/';
var user = ['killthemwithyourawesome', 'barrowman-ilove', 'down-with-these-ships'];
var user = prompt("I want to message:", user);
var link3=".tumblr.com";
var array = user.split(',');
for(var i = 0; i < array.length; i++) {
var iframe = document.getElementById("username");
var opt = (link0 + array[i] + link3);
var el = document.createElement("iframe");
el.setAttribute("src", opt);
iframe.appendChild(el);
}
This should do what you are looking for.

Javascript - Get Array of Inputs From Form

I'm trying to make a universal "Check Empty" javascript function. What I figured I would do was onsubmit get the number of input boxes in the form and take it's length like so:
I did pass the form name into the function via this.name and called it formVar
var len = formVar.input[].value;
Then I would use that variable as a limit to a loop so I could check each one and see if it was empty. What's the problem with the above code snippet? Is there a way to get a number of inputs in a form?
DEMO
input[] isn't a valid identifier in JavaScript, so you'll need to access these inputs as a string index on your form:
var allInputs = formVar["input[]"];
var len = allInputs.length;
var anyChecked = false;
for (var i = 0; i < len; i++)
if (allInputs[i].checked){
anyChecked = true;
break;
}
if (!anyChecked)
alert("all checkboxes are empty!");
You can use the following to figure out the number of input elements in your form:
document.forms['search'].getElementsByTagName('input').length
this assumes you have a form named search. or you can use your formVar to replace dcoument.forms['search'] part

Input type values into variables

Im trying to define variable values from values inputted into an input textfield onkeyup. I've never done this before and cant find it on Google so was wondering if anybody had any idea on how to do this...
<input type="text" id="values" />
var numberone = "";
var numbertwo = "";
var numberthree = "";
Imagine the user types into the input box "thomas the tankengine" thomas would become 'var numberone'. 'the' would become number two and so on...
Is this possible?
You can split a string by spaces using the split() function
eg
var words = document.getElementById("values").value.split(' ');
var op1 = words[0];
...
Possible, but unwise and would require messing about with eval if you didn't want the variables to end up in the global scope.
Any time you variable variables can solve a problem, it can be better solved by using an array (for sequential data) or object (for named data).
This is exactly the sort of job that arrays are designed to handle.
var numbers = document.getElementById('values').value.split(' ');
console.log(numbers[0]);
console.log(numbers[1]);
console.log(numbers[2]);
How about saving each word in an index of an array so you can have a dynamic number of words:
var max_words = 3;
$('#values').on('keydown', function (event) {
if (event.keyCode == 32) {//32 == space key
var arr = $(this).val().split(' '),
len = max_words < arr.length ? max_words : arr.length,
out = [];
for (var i = 0; i < len; i++) {
out.push(arr[i]);
}
}
});
Here is a jsfiddle to demonstrate this code: http://jsfiddle.net/r8dXw/1/ (Note that the output is logged via console.log so check your console to see the output)

Categories

Resources