Member Avatar for ShadyTyrant

Hello I have a web site called shadygames. I want to make sure that all the information is filled out in a contact form I have set up. I am using ajax to update the page if more information is required by the user. I have the email validation working but not the textarea. Please take a look and help me out.

Thank you all at daniweb.



javascript validation

  • 3 Contributors
  • 3 Replies
  • 178 Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by McLaren

Dani AI

Generated

Short diagnosis and a safe fix. correctly spotted the root cause: an undefined variable causes a runtime error, which aborts the script and allows the form to submit. Because a JS exception happens before the code that cancels submission runs, the browser proceeds with the default submit behavior. ‘s question — yes, the business rule is simply “message must not be blank” — means the textarea check should specifically reject empty or whitespace-only values.

Use an explicit submit handler that prevents default submission on validation failure and check the email length against the actual email variable (not an undefined name). Also trim or strip whitespace from the message so " " is rejected. Example approach (adjust IDs to match the markup):

document.getElementById('contact_form').addEventListener('submit', function (e) {
  var addr = (document.getElementById('email') || {}).value || '';
  var at = addr.indexOf('@'), dot = addr.lastIndexOf('.');
  if (at < 1 || dot < at + 2 || dot + 2 >= addr.length) {
    showXmlError('../xml/invalid_email.xml', 'invalid_email'); // your existing UI hook
    e.preventDefault();
    return;
  }
  var body = (document.getElementById('message') || {}).value || '';
  if (body.replace(/\s+/g, '').length === 0) {
    showXmlError('../xml/invalid_textarea.xml', 'invalid_textarea');
    e.preventDefault();
    return;
  }
  // valid — allow submit or proceed with AJAX send
});

Extra tips: 1) Use HTML5 attributes (type="email", required) for basic browser-side checks, but always validate on the server. 2) Disable the submit button while an AJAX send is in progress to avoid duplicates. 3) Use console.log and the browser devtools (as suggested) to catch exceptions — a single undefined name will stop the whole validation chain. 4) If you accept XML responses now, consider returning structured JSON for simpler client-side handling going forward.

Recommended Answers

All 3 Replies

Member Avatar for Member #898458

What are you trying to validate in the textarea? Is your business logic simply "if the textarea is not blank = OK"?

Member Avatar for ShadyTyrant

Yes, no point in sending an empty message to me.

Member Avatar for McLaren 
function ValidateContactForm()
{
	var email = document.forms["contact_form"]["email"].value;
	var atpos = email.indexOf("@");
	var dotpos = email.lastIndexOf(".");
	var message = document.forms["contact_form"]["message"].value;
	
	if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
	{
		Ajax("../xml/invalid_email.xml", "invalid_email");
		return false;
	}
	else if (message == null || message == "") 
	{

		Ajax("../xml/invalid_textarea.xml", "invalid_textarea");
		return false;
	}
	else
	{
		return true;	
	}
}

change the "return true" to return false at then it should not submit. After it you can add line console.log('ok') and now you can debug with firebug if you use firefox or if you use google chrome press ctrl + shift + i to open a console.

I tried submiting when email is valid but message empty and I shortly saw in console "x is not defined" and then it submitted. So I think the problem is with this line

if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)

it does not know what the x is.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.