Solved

Validate and Submit

Posted on 2007-11-25
8
375 Views
Last Modified: 2009-07-03
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
Comment
Question by:CreativeToyBox
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
8 Comments
 
LVL 12

Expert Comment

by:Sinoj Sebastian
ID: 20346540
use
<a href="#" onclick="document.askExpert.submit();return false;">
0
 

Author Comment

by:CreativeToyBox
ID: 20347238
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
 
LVL 63

Expert Comment

by:Zvonko
ID: 20347245
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
Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

 

Author Comment

by:CreativeToyBox
ID: 20347556
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
 

Author Comment

by:CreativeToyBox
ID: 20348515
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
 
LVL 63

Accepted Solution

by:
Zvonko earned 250 total points
ID: 20348582
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
 

Author Comment

by:CreativeToyBox
ID: 20348813
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
 
LVL 63

Expert Comment

by:Zvonko
ID: 20353968
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

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

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

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

It is a general practice to get rid of old user profiles on a computer  in a LAN environment. As I have been working with a company in a LAN environment where users move from one place to some other place at times. This will make many user profil…
This article discusses how to create an extensible mechanism for linked drop downs.
Learn the basics of strings in Python: declaration, operations, indices, and slicing. Strings are declared with quotations; for example: s = "string": Strings are immutable.: Strings may be concatenated or multiplied using the addition and multiplic…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question