Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 393
  • Last Modified:

Validate and Submit

Hi All,

I have been wracking my brain all morning and haven't come up with anything so here goes:

I have a form with this basic structure:

<form action="script.php" name="askExpert" onSubmit="return validateForm(this)" />

/-----Form Input fields-----/

<a href="javascript:document.askExpert.submit();">
<img src="submitbutton.jpg" alt="Submit" border="0"></a>
</form>

The form submits perfectly.
When I strip out the ---><a href="javascript:document.askExpert.submit();"><--- the validation works perfectly. However, when I use them together, the submit function skips the validation and just submits the form...

What do I need to add for both events to be fired?

Thanks in advance for your help!
0
CreativeToyBox
Asked:
CreativeToyBox
  • 4
  • 3
1 Solution
 
Sinoj SebastianCTO & OpenERP Project managerCommented:
use
<a href="#" onclick="document.askExpert.submit();return false;">
0
 
CreativeToyBoxAuthor Commented:
I replaced ---> <a href="javascript:document.askExpert.submit();">
with this ---> <a href="#" onclick="document.askExpert.submit();return false;">

It still submits perfectly..  however, it skips the validation ---> onSubmit="return validateForm(this)"
0
 
ZvonkoSystems architectCommented:
Check this:
<form action="script.php" name="askExpert" onSubmit="return validateForm(this)" />
 
/-----Form Input fields-----/
 
<a href="#" onClick="document.askExpert.Submit.onclick();return false">
<img src="submitbutton.jpg" alt="Submit" border="0"></a>
<input type="submit" name="Submit" value="Submit" style="display:none;" >
</form>

Open in new window

0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
CreativeToyBoxAuthor Commented:
I tried it and 'firebug' returned it as invalid:not a function

document.askExpert.Submit.onclick is not a function
onclick(click clientX=0, clientY=0)

I played around and tried various other things - and still no validation + submit.
0
 
CreativeToyBoxAuthor Commented:
Ok, I solved part of the problem with this:

<a href="javascript:void(0);" onclick="validateForm(document.askExpert)">

However, I need to add a submit string to the function like this:

function validateForm(f) {
  // some stuff ...
  if (no_error)
    f.submit();
  else
    return false;
}

Only problem now is..  I am not sure how to make the submit string work. Where do I place this string, and what should the wording be?  'no_error' is not working at all.  Here is the simple validation script:

<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Jeff Harding (jbh@site-ations.com) -->
<!-- Web Site: http://www.site-ations.com -->
<!-- Modified by: Ronnie T. Moore, Editor -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->


var empty = new Image(); empty.src = "fieldempty.gif";
var email = new Image(); email.src = "emailerror.gif";
var zipcd = new Image(); zipcd.src = "ziperror.gif";
var phone = new Image(); phone.src = "phoneerror.gif";

var haveerrors = 0;
function showImage(imagename, imageurl, errors) {
document[imagename].src = imageurl;
if (!haveerrors && errors) haveerrors = errors;
}

function validateForm(f) {

haveerrors = 0;
(f.comments.value.length < 1)
? showImage("commentserror", "images/f/xmark.gif", true)
: showImage("commentserror", "images/f/checkmark.gif", false);

(f.firstName.value.length < 1) // validate first name length
? showImage("firstNameerror", "images/f/xmark.gif", true) // no semi-colon after this line!
: showImage("firstNameerror", "images/f/checkmark.gif", false); // true = errors, false = no errors

(f.lastName.value.length < 1) // validate last name length
? showImage("lastNameerror", "images/f/xmark.gif", true)
: showImage("lastNameerror", "images/f/checkmark.gif", false);

(f.phone.value.length < 1) // validate last name length
? showImage("phoneerror", "images/f/xmark.gif", true)
: showImage("phoneerror", "imagesf/checkmark.gif", false);

(f.email.value.search("@") == -1 || f.email.value.search("[.*]") == -1) // validate email
? showImage("emailerror", "images/f/xmark.gif", true)
: showImage("emailerror", "images/f/checkmark.gif", false);

return (!haveerrors);
}


// End -->
</script>
Edit/Delete Message
0
 
ZvonkoSystems architectCommented:
Check please this:
<form action="script.php" name="askExpert" onSubmit="return validateForm(this)" />
 
/-----Form Input fields-----/
 
<a href="#" onClick="document.askExpert.Submit.click();return false">
<img src="submitbutton.jpg" alt="Submit" border="0"></a>
<input type="submit" name="Submit" value="Submit" style="display:none;" >
</form>

Open in new window

0
 
CreativeToyBoxAuthor Commented:
Wow, that works without the added mess!

Thanks!

You also have an easy way to use onBlur to validate the lines as my clients tab through the form?

(that way the checkmarks fire off as they work down the page)
0
 
ZvonkoSystems architectCommented:
You can get the input fields of a tab and call all onBlurs of that tab like this:

var elem = document.getElementById("tabID1").getElementsByTagName("input");
for(var i=0;i<elem.length;i++){
  elem[i].onblur();
}

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now