JavaScript - 2 Forms Same Page Validation Issue

Hello all,

I have had a look around the forums, but cannot find the answer that I am after. basically, I have a text area to enter a search, and I have already written the JavaScript part of it (unsure if this is where the problem lies). The text that will go into the text area is a URL. the search button is disabled if there are spaces in the query, or if the field is blank, else the button is enabled. The problem I'm having may or may not be to do with my script. The HTML is set to 'onKeyUp' and 'onBlur' to run the function. now, it works fine, unless the user uses the mouse to copy and paste a URL into the text area. the button remains disabled until the user focuses out of the text area then back in. if ctrl+v is used, then the function works. If you would like to see the script I have written let me know, I hope you have some ideas

Thanks in advance!

Hi,

I am working on simple project and it's for the institute Class project where i am learning php. i have to submit the project as soon as possible. But i am doing it different way then of i was supposed. Instead of validation message i want to use a picture or icon with Red error icon and Green yes icon as you can check in the attached picture. I am calling a function on submit button and if there is any error then using document.GetElementById('error').style.background="none" and ="pic url". I am getting output but it's just for a second then disappeared. I have already attached the Screen Shot to get the full idea..

Mainly i want to display red icon on error and green one when there is not error.

Ok, so I'm using two different scripts for my websites registrations. One is genvalidatorv4, from here. Now, instead of messing around with messy regular expressions for a birthday validation, I decided to hunt around for something procedural like the Facebook registration. I found this.

Now I have the validation running great up until the bday picker. See, that script uses Jquery to output the form select boxes on a page load. Here's the form's code:


Code:

				<form action="new_client_exec.php" id="newClient" method="post">
					<span>
						<label for='FirstName'>First Name:</label>
						<input type="text" id="FirstName" name="FirstName" />
						<div id='newClient_FirstName_errorloc' class='error_strings'></div>
					</span>
					<span>
						<label for='LastName'>Last Name:</label>
						<input type="text" id="LastName" name="LastName" />
						<div id='newClient_LastName_errorloc' class='error_strings'></div>
					</span>
					<span>
						<label for='Email'>Email:</label>
						<input type="text" id="Email" name="Email" />
						<div id='newClient_Email_errorloc' class='error_strings'></div>
					</span>
					<span>
						<label for='ConfirmEmail'>Confirm Email:</label>
						<input type="text" id="ConfirmEmail" name="ConfirmEmail" />
						<div id='newClient_ConfirmEmail_errorloc' class='error_strings'></div>
					</span>
					<span>
						<div id="bdayLabel">Birthday:</div>
						<div class="picker" id="bdaypicker"></div>
						<div class="clear"></div>
						<div id='newClient_birthmonth_errorloc' class='error_strings'></div>
					</span>
					<span>
						<input type="submit" name="submit" value="Submit" />						
					</span>
				</form>	
				<script type="text/javascript">
 					var frmvalidator  = new Validator("newClient")
						frmvalidator.EnableOnPageErrorDisplay();
						frmvalidator.EnableMsgsTogether();
						frmvalidator.addValidation("FirstName","req","Please enter your First Name");
 						frmvalidator.addValidation("FirstName","maxlen=24","Max length is 24");
						frmvalidator.addValidation("LastName","req","Please enter your Last Name");
 						frmvalidator.addValidation("LastName","maxlen=24","Max length is 24");
						frmvalidator.addValidation("Email","maxlen=50", "Max length is 50");
 						frmvalidator.addValidation("Email","req", "Please enter your Email");
 						frmvalidator.addValidation("Email","email", "This email appears to be invalid");
						frmvalidator.addValidation("ConfirmEmail","req", "Please confirm your Email");
						frmvalidator.addValidation("ConfirmEmail","eqelmnt=Email", "The confirmed password is not same as password");
				</script>

Now, when the page is run, it adds the bday fieldset into the <div class="picker" id="bdaypicker"></div>. As you can see, the validator accesses the field data via the "name" attribute, so I try to add validation to what the ids and names that the picker script adds but it doesn't work.

Now, I'm fairly new to Javascript and it's derivatives, but if classes, ids, and names are already being used or generated by other scripts, does that not allow you to access them elsewhere in a different script? I've tried just about everything else, including going into that picker script and modifying the names and ids it outputs. I'm sorry for not being able to post a full html page. I don't want links to this site floating around out there yet. If I need to I'll post a dummy page with all the necessary code. Thanks for any help!

I can't seem to get any Email validation to work, at all. no matter what different tactic I try.

Right now I'm trying the most simplest of tactics..

Code:

if((document.subscribe.contacttype.selectedIndex==1) && (document.subscribe.email.value=="")){
		alert("Please enter a Valid Email Address.");
		return false;
		}
		else{
			if((document.subscribe.email.indexOf('@') < 0) || ((document.subscribe.email.charAt(email.length-4) != '.') && (document.subscribe.email.charAt(email.length-3) != '.')))
			{alert("you have entered an invalid Email Address. Please try again.");
			}
		}
}

Any suggestions? my 'Email' feed is displayed after the 'drop-down selector' has been chosen, thus, the invoking of the if selectedIndex==1 && email.value="" return false;.

Thanks for your assistance ahead of time.

My code is working pretty well, except I have an issue validating. I think it may be to do with when there is an empty string. I know that NaN is Not a Number, but the only issue I can find with my code is when I input a non-digit such as "k" for example.

And because I have put some code in to reload the page when it does not validate, when it refreshes it has 2 popup boxes.

Thanks for taking the time to read my post

Code:

<html>
	<head>	
	<title>Sound Travel Calculator</title>
	
	<script type="text/javascript">
	// Setting our variables based on user input
	var hours = 0;
	var mins = 0;
	var m_per_secs = 340;
	
	alert("Speed of Sound \n\nAt Sea Level Sound Travels At 340 Metres Per Second \n\nIf You Would Like To Know How Far Sound Will Travel In A Given Time, Click OK");
	hours = prompt("Please Enter Hours (If less than 1 hour, just type 0)");
	mins = prompt("Please Enter Minutes");
	
	// Validating input for a number less than zero or an not a number
	if ((isNaN(hours)) || (hours < 0) || (isNaN(mins)) || (mins < 0)) 
		{
		alert("Please enter a numeric value, zero or greater");
		window.location.reload(true);
		}
	
	// if there is no input, the value is set to zero
	if (hours =="") 
		{
		hours = 0;
		}
	if (mins =="") 
		{
		mins = 0;
		}
		
	// Calculations
	dist = (((parseFloat(hours)) * 60 * 60) + (parseFloat(mins * 60)) * parseFloat(m_per_secs) / 1000)
	
	// Output our calculation
	alert("The Distance of Sound Travelled is " + (dist) + " Kilometres");

	</script>
	</head>
	<body>
	</body>
</html>

Hi,

I have a simple bit of HTML / Javascript to validate email addresses entered into a field, split by a comma.

Code:

<html>
<body>
<form name="myForm" onsubmit="return chkEmail()" method="post">
e: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>
</body>
</html>

Code:

function validateEmail(email) { 
    var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    return re.test(email);
}
 
function chkEmail(){
	var myString = document.forms["myForm"]["fname"].value;
	var mySplitResult = myString.split(",");
	for(i = 0; i < mySplitResult.length; i++){
		emailCheck = validateEmail(mySplitResult[i]);
		alert(mySplitResult[i] + " - " + emailCheck);
		if (emailCheck = 'false') {
			alert(emailCheck);
		}
	}
}

If I enter e.g. "you@me.com,this@that.com" into the form, the alert debugs show:

First: you@me.com - true
Second: false
Third: this@that.com - true
Fourth: false

The first debug seems to show that the condition is true, but then the if statement to check for a "false" value is firing, showing the value of "emailCheck" = "false", even though on the preceding alert, the value = "true".

I'm not sure what's going wrong.

Apologies for any silly mistakes.

I also put my code he http://jsfiddle.net/XYyZa/

Thanks

I'm having a problem validating this script in w3c its the last one to make the page valid xhtml transitional. here are the errors w3c gives me for the code.the website in question is http://www.orgdesignz.com

Error Line 2722, Column 31: document type does not allow element "p" here

Code:

 	document.write('<p class="no">We\'ve detected that you\'re using <strong>AdBlock Plus</strong> or some other adblocking software. Please be aware that this is only contributing to the demise of the site. We need money to operate the site, and almost all of that comes from our online advertising. To read more about why you should disable ABP, please <a href="#">click here</a>.<!-- end .content --></p>');

the error was detected on the > after "no"


The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

Thanks,
Mike@orgdesignz

Hello,
On my client's site: www.twdcycling.com he wanted a place where people could make suggestions for his blog.
I accomplished the simple form using a textarea field and even put a little text that clears on clicks and reappears on blur.
When you go there--go to the bottom left.

It also actually works.
The problem is that (besides the fact that so far no one has cared to make a suggestion) somehow the form is (this is what I believe) being submitted automatically. I don't believe a human is clicking submit. When I click submit w/o clicking in the field the default text that I have in the field already gets submitted in the generated email.

So I now need to work on my validation in my php file that sends the email.
For background I obtained my php file from html-form-guide.com
here the file is in its entirety:
Code:

<?php
if(!isset($_POST['submit']))
{
	//This page should not be accessed directly. Need to submit the form.
	echo "error; you need to submit the form!";
}
$name = $_POST['name'];
$visitor_email = $_POST['email'];
$message = $_POST['message'];

//Validate first
if(empty($name)||empty($visitor_email)) 
{
    echo "Name and email are mandatory!";
    exit;
}

if(IsInjected($visitor_email))
{
    echo "Bad email value!";
    exit;
}

$email_from = 'tom@amazing-designs.com';//<== update the email address
$email_subject = "New Form submission";
$email_body = "You have received a new message from the user $name.\n".
    "Here is the message:\n $message".
    
$to = "tom@amazing-designs.com";//<== update the email address
$headers = "From: $email_from \r\n";
$headers .= "Reply-To: $visitor_email \r\n";
//Send the email!
mail($to,$email_subject,$email_body,$headers);
//done. redirect to thank-you page.
header('Location: thank-you.html');


// Function to validate against any email injection attempts
function IsInjected($str)
{
  $injections = array('(\n+)',
              '(\r+)',
              '(\t+)',
              '(%0A+)',
              '(%0D+)',
              '(%08+)',
              '(%09+)'
              );
  $inject = join('|', $injections);
  $inject = "/$inject/i";
  if(preg_match($inject,$str))
    {
    return true;
  }
  else
    {
    return false;
  }
}
   
?>

It does have some validation code, and it also is set up to handle more parameters than I needed. I tried to just pare it down to the one simple thing (I just need the user to type anything they want into my text area)

My reasoning is that I should be able to go get some simple validation snippet to make it so that if there is the possibility something is causing the form to just "fire off" w/o a human clicking, the validation shouldn't allow it to send, cause the text field is empty. But one would think if that is happening my default text would allow it to send, but oddly enough, no! when I get the email (last one at 5:49 am) it was a blank email! So its like some robot is doing two things: clicking in the field to empty it and THEN clicking submit! Weird, I know. But the validation code would fix this if only I knew how. (But on another note, if I try to send an empty box my default text pops back in when I click submit--proving that its happening automatically.

I tried all morning yesterday to implement a snippet from several sources.

Here's a couple of examples of what I added:

Code:

function emptyvalidation(entered, alertbox)
{
// Emptyfield Validation by Henrik Petersen / NetKontoret
// Explained at www.echoecho.com/jsforms.htm
// Please do not remove this line and the two lines above.
with (entered)
{
if (value==null || value=="")
{if (alertbox!="") {alert(alertbox);} return false;}
else {return true;}
}
}

I didn't modify this code at all....maybe where I went wrong here. Should "value" correspond to text area name "message"? (about the only thing I didn't try)
Here's another one --this one from W3 schools:
Code:

function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="")
  {
  alert("First name must be filled out");
  return false;
  }
}

this is how it was on the source site, all I changed was "myForm" and "fname" to "blog_suggestion"

But when testing both these snippets separately what happened is that on submit I just go to my php page (which is just blank) I'm assuming code I'm adding is crashing the script somehow. And then of course no thank you page and no email sent.

Finally here is my current php page in its entirety, followed by the form code on the home page...
Code:

<?php
if(!isset($_POST['submit']))
{
	//This page should not be accessed directly. Need to submit the form.
	echo "error; you need to submit the form!";
}

$message = $_POST['message'];

//Validate first
if(empty($message)) 
{
    echo "Please enter a suggestion before clicking submit.";
    exit;
}


$email_from = 'f7digitaldesign@gmail.com';//<== update the email address
$email_subject = "SOMEONE HAS SUBMITTED A SUGGESTION FOR THE BLOG!";
$email_body = "\n $message".

$to = "f7digitaldesign@gmail.com";//<== update the email address
$headers = 'From: '.$email_from."\r\n".
'Reply-To: '.$email_from."\r\n" .

//Send the email!
mail($to,$email_subject,$email_body,$headers);
//done. redirect to thank-you page.
header('Location: thank-you.html');


// Function to validate against any email injection attempts
function IsInjected($str)
{
  $injections = array('(\n+)',
              '(\r+)',
              '(\t+)',
              '(%0A+)',
              '(%0D+)',
              '(%08+)',
              '(%09+)'
              );
  $inject = join('|', $injections);
  $inject = "/$inject/i";
  if(preg_match($inject,$str))
    {
    return true;
  }
  else
    {
    return false;
  }
}
   
?>

I tried to modify the validation I got w/ this to produce the "echo" message "Please enter a suggestion before clicking submit." But let's be honest, by now you know I don't know what in the heck I'm doing (it doesn't seem to matter).

Form code:
Code:

<form name="blog_suggetion" method="post" action="send_form_blogidea.php">
                     <span class="bloginfotext" ><textarea name="message" rows="14" cols="12" onfocus="clearValue(this, 'Please submit ideas for our blog here&mdash;we&rsquo;d love to hear from you!')" onclick="this.value='';" onblur="if (this.value == '') {this.value = 'Please submit ideas for our blog here&mdash;we&rsquo;d love to hear from you!';}" ></textarea></span>
        <div style="font-size:6px; color:#FFF;">sdsadfds</div>
               &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" name='submit' value="submit">
             </form>

Any time spent and help offered for this is greatly appreciated!! Also if you need to/want to test the field, I don't care--send me a message. I'll know someone cares!
Brian

Hi,

I am very new to Javascript and am having some difficulties with implementing two forms on the same page.

The page in question is http://www.devoteddomains.com/contac...ed-domains.asp.

The form at the top appears on every page and works on all of the other pages except this one. When you try to complete the form it validates the second form on the page.

The code for the top form can be found he http://www.devoteddomains.com/web-de...vices-cta.html (it is an include file).

The two scripts that I am using are as follows:

Top Form: http://www.devoteddomains.com/scripts/scripts.js

Contact Page Form: http://www.devoteddomains.com/scripts2/scripts.js

Can someone please help!

Cheers,
Peter

I want to have several forms on one page that are not displayed until a selection is made from the category drop down box(select element). The form displayed will depend on the selection made. Here is the code I have so far. Please help.

Code:

<body>
<label id="Label1">ADMINISTRATOR CONSOLE - ADD AND EDIT ASSETS<br />
</label>
<form action="" method="post" style="border-style: ridge; width: 311px; height: 37px;" name="myform">
<table>
<tr>
<td>Select Category:</td><td>
<select name="category" onchange="set_sub_category()" style="width: 157px">
<option selected="selected" value="select">Select an Option</option>
<option value="add">Add Category</option>
<option value="district">Council District</option>
<option value="region">Region</option>
<option value="pom">POM</option>
<option value="proptype">Property Type</option>
<option value="assetcat">Asset Category</option>
<option value="assettype">Asset Type</option>
<option value="property">Property</option>
<option value="asset">Asset</option>
</select>
</td>
</tr>
</table>
</form>

<form style="display:none" action= "admin_console_new.html" onsubmit="return (validate_form(this)& validate_list(this))" method="post" style="border-style: ridge; border-width: medium; height: 154px; width: 346px;" name="district">
<table style="height: 86px">
<tr>
<td>Select District Value:</td><td>
<select name="district">
<option selected="selected">Select an Option</option>
<option>Add Council District</option>
</select>
</td>
</tr><tr>
<td>Enter District Name:</td><td>
<input name="name" type="text"/>
</td>
</tr><tr>
<td>Enter Description:</td><td><textarea name="description"></textarea>
</td>
</tr><tr>
<td><input type="submit" value="Submit" name="Submit3" /><input type="reset" value="Reset" />
</td>
</tr>
</table>
</form>

I'm using the autofill forms plugin for firefox which can be found he

https://addons.mozilla.org/en-US/firefox/addon/4775

I use it to automatically fill various web forms, duh. But I would like certain values to be chosend randomly from a list I create.

I contacted the developer and he said the add on probably does not need a new feature because there is a 'dynamic tags' function to fill certain forms with dynamic values (e.g. the current time or date). He has given over the project to another developer and told me I probably would find a solution in a good javascript programming forum.

So here I am! Can anyone help me with this? Basically, I just need a javascript code which chooses on item from an array randomly, I guess? I'm not a programmer myself, so any help would be greatly (!) appreciated.

Thanks a lot in advance for any further guidance!

Note: Here are sample dynamic tags from the plugin:

<datetime> new Date().toLocaleString()
<useragent> navigator.userAgent
<langcode> navigator.language
<resolution> screen.width+'x'+screen.height
<clipboard> this.getClipboardText()

Hello Coding Forum gurus, I'm hoping to find some help here with a javascript order form. I am currently working on a javascript form that requires field validation as well as a summary page (order confirmation) after every field is entered correctly. At this point I am satisfied with the field validation portion of the script, however, I am not sure how to call a function to display the summary page.


here is a description of my dilemma:

To begin, the field validation functions are called by the form's onsubmit event handler. Which then works it way through several text field validation functions. After the script finishes validating and checking each field for acceptable input, how do I call a function to display a summary page of the order form?




On a side note, the only programming experience I have ever had is with javascript. I have never taken any other programming classes, and I am fairly new to this. Any help would be appreciated.

Not sure if I am allowed to post the entire script here or not but I'd be willing to send to anyone that would like to take a look, HUGE THANK YOU in advance to anyone that takes time out of their busy schedules to take a look.

Hi I have a problem with a form in my site he

http://www.21centuryanswers.com/submit.php

if no field is filled and you click submit, an alert will be shown, yet the next page will still load! How do I fix it?

the code for the form is:

<form action="privacy.php" method="post" onsubmit="return checkform(this);">
<fieldset>
<center>
E-mail: <input type="textfield" name="email" size="60" value="" /><br/></br>
Question: <input type="textfield" name="question" size="70" value="" /><br/><br/>

<input type="submit" value = "Submit"/>
</center>
</fieldset>
</form>

and here is the validation script:

<script language="JavaScript" type="text/javascript">
<!--
function checkform ( form )
{
// ** START **


if (form.email.value == "") {
alert( "Please enter your email." );
form.author.focus();
return false ;
}
if (form.question.value == "") {
alert( "Please enter the question." );
form.title.focus();
return false ;
}
// ** END **
return true ;
}
//-->
</script>

Please help!

I am in desperate need for help as I'm pulling my hair out! I'm pretty sure this is JavaScript related.

I'm incorporating a WordPress header into Opencart. Its pretty basic. I copied the WordPress header source code into the header of the Opencart and all is well in Firefox & Chrome and Safari. In IE however...If you enter the product page through the categories on the left the product page left aligns and breaks...I can't figure this out for the life of me. I tried to debug it with explorers tools but I don't know enough about Java script to understand why its breaking.


Can anyone PLEASE help me on this?!!! My site is http://www.sterlingportable.com/store/

I have an issue with my div visibility toggling

Code:

 function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
		
    }

I call it from an image map he Code:

<area shape="rect" coords="234,-12,480,203" href="#peripherala"  onclick="toggle_visibility('peripherala');toggle_visibility('shadow');return false"/>

and I do the return false to stop the thing from jumping all over the place, but where i click next, the page scrolls down to center on that point, which is really annoying. How do I stop it?
Thanks for any help....