Javascript onClick question

[Mtek]

Hi,

We have a form defined with buttons like this:

<a class="save_menu" href="javascript:document.Detail_Screen.action =
'savedata.php?screen=EDIT';document.Detail_Screen. submit();">Update</
a>

The form also has an onSubmit action to vall a validation routine:

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>

The problem is that the formvalidation routine is not being fired.

I'm at a loss here. Can anyone help us with this? At the end of the
javascript validation routine, we have this:

thisform.submit();

So, the form seems to submit, but not the way we want it to. We want
it to execute the validation routine first.....

Thank you.

John.

[Dan Rumney]

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"

onsubmit='return formvalidation(this)'>

The problem is that the formvalidation routine is not being fired.

I'm at a loss here. Can anyone help us with this? At the end of the
javascript validation routine, we have this:

thisform.submit();

formvalidation should return TRUE or FALSE, depending on whether the
form's content is valid, or not.

If that doesn't help, please provide a more detailed code sample; an
ideal example would be a URL to a page demonstrating the problem

[Peter Michaux]

On Jun 1, 4:31 pm, Mtek <[e-mail]:

Hi,

We have a form defined with buttons like this:

<a class="save_menu" href="javascript:document.Detail_Screen.action =
'savedata.php?screen=EDIT';document.Detail_Screen. submit();">Update</
a>

Why are you using an anchor element to submit a form? A submit input
or button would be the appropriate choice and works with JavaScript
disabled.

The form also has an onSubmit action to vall a validation routine:

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>

Single quotation marks around attribute values are not valid.

The problem is that the formvalidation routine is not being fired.

I'm at a loss here. Can anyone help us with this? At the end of the
javascript validation routine, we have this:

thisform.submit();

remove that

So, the form seems to submit, but not the way we want it to. We want
it to execute the validation routine first.....

How about something straight forward like this

<form name="Detail_Screen" action="savedata.php"
method="post" onsubmit="return formvalidation(this);">

<input type="submit" name="screen" value="EDIT">
</form>

If you really must have a link trigger the form submission then you
can do that but it seems very odd.

Peter

[Peter Michaux]

On Jun 1, 4:53 pm, Dan Rumney <[e-mail]:

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>

The problem is that the formvalidation routine is not being fired.

I'm at a loss here. Can anyone help us with this? At the end of the
javascript validation routine, we have this:

thisform.submit();

formvalidation should return TRUE or FALSE, depending on whether the
form's content is valid, or not.

JavaScript will type convert the return value of the onsubmit handler
to be a boolean. That type converted value will be used to determine
if the form should be submitted or not.

If that doesn't help, please provide a more detailed code sample; an
ideal example would be a URL to a page demonstrating the problem

Where that page is self-complete and only 30 to 40 lines long.

Peter

[Mtek]

On Jun 1, 7:12*pm, Peter Michaux <[e-mail]:

On Jun 1, 4:53 pm, Dan Rumney <[e-mail]:

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>

The problem is that the formvalidation routine is not being fired.

I'm at a loss here. *Can anyone help us with this? *At the end of the
javascript validation routine, we have this:

thisform.submit();

formvalidation should return TRUE or FALSE, depending on whether the
form's content is valid, or not.

JavaScript will type convert the return value of the onsubmit handler
to be a boolean. That type converted value will be used to determine
if the form should be submitted or not.

If that doesn't help, please provide a more detailed code sample; an
ideal example would be a URL to a page demonstrating the problem

Where that page is self-complete and only 30 to 40 lines long.

Peter

Well, the client wants the inmage button. And, as you can see, it is
not really an image, but a class. That is what they want, so that is
how I have to code it. The page submits and the data is saved, it
just does not call the javascript validation routine. That is where
my issue is.......

Making it a SUBMIT will not work since it is not a 'real' button.
Here is a clip of the code:

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>
.
.
<table class="menu" cellspacing=0>
<TR>
<td class="menu1"><a class="save_menu"
href="javascript:document.Detail_Screen.action = 'savedata.php?
screen=EDIT';document.Detail_Screen.submit();">Upd ate</a></td>
<td style="width:1px"><img src="../images/admin2/
separator_27h.gif"></td>
<td class="menu1"><a class="save_menu"
href="javascript:document.Detail_Screen.action = 'savedata.php?
screen=DELETE';document.Detail_Screen.submit();">D elete</a></td>
<td style="width:1px"><img src="../images/admin2/
separator_27h.gif"></td>
</tr>
</table>
.
.
</FORM>

Thanks for everyone's help so far.....

John

[Dan Rumney]

Making it a SUBMIT will not work since it is not a 'real' button.

Here is a clip of the code:

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>
.
.

Can you provide the source for 'formvalidation'?

[Mtek]

On Jun 1, 8:54*pm, Dan Rumney <[e-mail]:

Making it a SUBMIT will not work since it is not a 'real' button.
Here is a clip of the code:

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>
.
.

Can you provide the source for 'formvalidation'?

Here you go, and thanks!!

function formvalidation(thisform) {
if (emptyvalidation(thisform.CustName.value,"Customer Name is
empty")==false) {thisform.CustName.focus(); return false;};
if (emailvalidation(thisform.CustEmail.value,"Illegal E-
mail")==false) {thisform.CustEmail.focus(); return false;};

if (thisform.CellPhone.value==null || thisform.CellPhone.value==""
|| thisform.CellPhone.value==" ") {
thisform.CellPhone.value="000-000-0000";
} else {
if (phonevalidation(thisform.CellPhone.value,"Please enter a
valid cell phone")==false) {
thisform.CellPhone.focus(); return false;
};
};
thisform.submit();
}

[Peter Michaux]

On Jun 1, 6:46 pm, Mtek <[e-mail]:

On Jun 1, 7:12 pm, Peter Michaux <[e-mail]:

On Jun 1, 4:53 pm, Dan Rumney <[e-mail]:

<FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>

The problem is that the formvalidation routine is not being fired.

I'm at a loss here. Can anyone help us with this? At the end of the
javascript validation routine, we have this:

thisform.submit();

formvalidation should return TRUE or FALSE, depending on whether the
form's content is valid, or not.

JavaScript will type convert the return value of the onsubmit handler
to be a boolean. That type converted value will be used to determine
if the form should be submitted or not.

If that doesn't help, please provide a more detailed code sample; an
ideal example would be a URL to a page demonstrating the problem

Where that page is self-complete and only 30 to 40 lines long.

Peter

Well, the client wants the inmage button. And, as you can see, it is
not really an image, but a class. That is what they want, so that is
how I have to code it.

You can style a <button type="submit"element.

Peter

[Dan Rumney]

Here you go, and thanks!!

>
function formvalidation(thisform) {
if (emptyvalidation(thisform.CustName.value,"Customer Name is
empty")==false) {thisform.CustName.focus(); return false;};
if (emailvalidation(thisform.CustEmail.value,"Illegal E-
mail")==false) {thisform.CustEmail.focus(); return false;};

if (thisform.CellPhone.value==null || thisform.CellPhone.value==""
|| thisform.CellPhone.value==" ") {
thisform.CellPhone.value="000-000-0000";
} else {
if (phonevalidation(thisform.CellPhone.value,"Please enter a
valid cell phone")==false) {
thisform.CellPhone.focus(); return false;
};
};
thisform.submit();
}

Change "thisform.submit()" to "return true"

However, Reading you original post again, you wrote:

<a class="save_menu"

href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';

document.Detail_Screen.submit();">Update</>a>

[snip]

At the end of the javascript validation routine, we have this:

thisform.submit();

So, the form seems to submit, but not the way we want it to. We want
it to execute the validation routine first.

So, I think you're saying "Why isn't validation performed when the user
clicks on Update?"

So, I believe this is an accurate description of what's happening. I've
looked for something to back it up, but all I can find are unreferenced
comments on the web.

The onSubmit Event Handler is is used to execute specified JavaScript
code whenever the *user* submits a form.

I believe the problem you have is that Javascript aclling the submit()
function is *not* the same as the user submitting the form. Thus the
onSubmit handler is not invoked.

In fact, this is why you calling submit() in your onSubmit handler does
not cause an infinite loop.

The resolution would be an explicit call to formvalidation()
.... something like:

<a class="save_menu"
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
formvalidation(document.Detail_Screen) &&
document.Detail_Screen.submit();">Update</>a>

[Mtek]

On Jun 1, 9:49*pm, Dan Rumney <[e-mail]:

Here you go, and thanks!!

function formvalidation(thisform) {
* * if (emptyvalidation(thisform.CustName.value,"Customer Name is
empty")==false) {thisform.CustName.focus(); return false;};
* * if (emailvalidation(thisform.CustEmail.value,"Illegal E-
mail")==false) {thisform.CustEmail.focus(); return false;};

* * if (thisform.CellPhone.value==null || thisform.CellPhone.value==""
|| thisform.CellPhone.value==" ") {
* * * *thisform.CellPhone.value="000-000-0000";
* * } else {
* * * *if (phonevalidation(thisform.CellPhone.value,"Please enter a
valid cell phone")==false) {
* * * * * thisform.CellPhone.focus(); return false;
* * * *};
* * };
* * thisform.submit();
}

Change "thisform.submit()" to "return true"

However, Reading you original post again, you wrote:

*<a class="save_menu"
*>
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
** * document.Detail_Screen.submit();">Update</>a>

[snip]

*At the end of the javascript validation routine, we have this:
*>
*thisform.submit();
*>
*So, the form seems to submit, but not the way we want it to. *We want
*it to execute the validation routine first.

So, I think you're saying "Why isn't validation performed when the user
clicks on Update?"

So, I believe this is an accurate description of what's happening. I've
looked for something to back it up, but all I can find are unreferenced
comments on the web.

The onSubmit Event Handler is is used to execute specified JavaScript
code whenever the *user* submits a form.

I believe the problem you have is that Javascript aclling the submit()
function is *not* the same as the user submitting the form. Thus the
onSubmit handler is not invoked.

In fact, this is why you calling submit() in your onSubmit handler does
not cause an infinite loop.

The resolution would be an explicit call to formvalidation()
... something like:

<a class="save_menu"
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
formvalidation(document.Detail_Screen) &&
document.Detail_Screen.submit();">Update</>a>- Hide quoted text -

- Show quoted text -

Wow Dan! Almost perfect. After it displays the error message though,
it opens a blank page with the word 'false' on it.

Can you explain to me how that works with the &&???

Thanks, and, why does it open up a page with 'false'??

John

[Mtek]

On Jun 1, 9:49*pm, Dan Rumney <[e-mail]:

Here you go, and thanks!!

function formvalidation(thisform) {
* * if (emptyvalidation(thisform.CustName.value,"Customer Name is
empty")==false) {thisform.CustName.focus(); return false;};
* * if (emailvalidation(thisform.CustEmail.value,"Illegal E-
mail")==false) {thisform.CustEmail.focus(); return false;};

* * if (thisform.CellPhone.value==null || thisform.CellPhone.value==""
|| thisform.CellPhone.value==" ") {
* * * *thisform.CellPhone.value="000-000-0000";
* * } else {
* * * *if (phonevalidation(thisform.CellPhone.value,"Please enter a
valid cell phone")==false) {
* * * * * thisform.CellPhone.focus(); return false;
* * * *};
* * };
* * thisform.submit();
}

Change "thisform.submit()" to "return true"

However, Reading you original post again, you wrote:

*<a class="save_menu"
*>
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
** * document.Detail_Screen.submit();">Update</>a>

[snip]

*At the end of the javascript validation routine, we have this:
*>
*thisform.submit();
*>
*So, the form seems to submit, but not the way we want it to. *We want
*it to execute the validation routine first.

So, I think you're saying "Why isn't validation performed when the user
clicks on Update?"

So, I believe this is an accurate description of what's happening. I've
looked for something to back it up, but all I can find are unreferenced
comments on the web.

The onSubmit Event Handler is is used to execute specified JavaScript
code whenever the *user* submits a form.

I believe the problem you have is that Javascript aclling the submit()
function is *not* the same as the user submitting the form. Thus the
onSubmit handler is not invoked.

In fact, this is why you calling submit() in your onSubmit handler does
not cause an infinite loop.

The resolution would be an explicit call to formvalidation()
... something like:

<a class="save_menu"
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
formvalidation(document.Detail_Screen) &&
document.Detail_Screen.submit();">Update</>a>- Hide quoted text -

- Show quoted text -

Wow Dan! Almost perfect. After it displays the error message though,
it opens a blank page with the word 'false' on it. Also, now when it
calls the email validation function, I get an error: "entered.value
has no properties"

function emailvalidation(entered, alertbox) {
apos=entered.indexOf("@");
dotpos=entered.value.lastIndexOf(".");
lastpos=entered.length-1;
if (apos<1 || dotpos-apos<2 || lastpos-dotpos>3 || lastpos-
dotpos<2)
{if (alertbox) {alert(alertbox);} return false;}
else {return true;}
}

Thanks for everyone's help so far.

John

[Mtek]

On Jun 1, 9:49*pm, Dan Rumney <[e-mail]:

Here you go, and thanks!!

function formvalidation(thisform) {
* * if (emptyvalidation(thisform.CustName.value,"Customer Name is
empty")==false) {thisform.CustName.focus(); return false;};
* * if (emailvalidation(thisform.CustEmail.value,"Illegal E-
mail")==false) {thisform.CustEmail.focus(); return false;};

* * if (thisform.CellPhone.value==null || thisform.CellPhone.value==""
|| thisform.CellPhone.value==" ") {
* * * *thisform.CellPhone.value="000-000-0000";
* * } else {
* * * *if (phonevalidation(thisform.CellPhone.value,"Please enter a
valid cell phone")==false) {
* * * * * thisform.CellPhone.focus(); return false;
* * * *};
* * };
* * thisform.submit();
}

Change "thisform.submit()" to "return true"

However, Reading you original post again, you wrote:

*<a class="save_menu"
*>
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
** * document.Detail_Screen.submit();">Update</>a>

[snip]

*At the end of the javascript validation routine, we have this:
*>
*thisform.submit();
*>
*So, the form seems to submit, but not the way we want it to. *We want
*it to execute the validation routine first.

So, I think you're saying "Why isn't validation performed when the user
clicks on Update?"

So, I believe this is an accurate description of what's happening. I've
looked for something to back it up, but all I can find are unreferenced
comments on the web.

The onSubmit Event Handler is is used to execute specified JavaScript
code whenever the *user* submits a form.

I believe the problem you have is that Javascript aclling the submit()
function is *not* the same as the user submitting the form. Thus the
onSubmit handler is not invoked.

In fact, this is why you calling submit() in your onSubmit handler does
not cause an infinite loop.

The resolution would be an explicit call to formvalidation()
... something like:

<a class="save_menu"
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
formvalidation(document.Detail_Screen) &&
document.Detail_Screen.submit();">Update</>a>- Hide quoted text -

- Show quoted text -

Thanks Dan.

When I put your code in and submit the form, I get the validation
error message I am supposed to, but then the page changes with only
the word 'false' on it.

Also, when it executes the routine to validate the email, I get this
"entered.value has no properties"

function emailvalidation(entered, alertbox) {
apos=entered.value.indexOf("@");
dotpos=entered.value.lastIndexOf(".");
lastpos=entered.length-1;
if (apos<1 || dotpos-apos<2 || lastpos-dotpos>3 || lastpos-
dotpos<2)
{if (alertbox) {alert(alertbox);} return false;}
else {return true;}
}

Thanks again for your help.

John

[Mtek]

On Jun 1, 9:49*pm, Dan Rumney <[e-mail]:

Here you go, and thanks!!

function formvalidation(thisform) {
* * if (emptyvalidation(thisform.CustName.value,"Customer Name is
empty")==false) {thisform.CustName.focus(); return false;};
* * if (emailvalidation(thisform.CustEmail.value,"Illegal E-
mail")==false) {thisform.CustEmail.focus(); return false;};

* * if (thisform.CellPhone.value==null || thisform.CellPhone.value==""
|| thisform.CellPhone.value==" ") {
* * * *thisform.CellPhone.value="000-000-0000";
* * } else {
* * * *if (phonevalidation(thisform.CellPhone.value,"Please enter a
valid cell phone")==false) {
* * * * * thisform.CellPhone.focus(); return false;
* * * *};
* * };
* * thisform.submit();
}

Change "thisform.submit()" to "return true"

However, Reading you original post again, you wrote:

*<a class="save_menu"
*>
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
** * document.Detail_Screen.submit();">Update</>a>

[snip]

*At the end of the javascript validation routine, we have this:
*>
*thisform.submit();
*>
*So, the form seems to submit, but not the way we want it to. *We want
*it to execute the validation routine first.

So, I think you're saying "Why isn't validation performed when the user
clicks on Update?"

So, I believe this is an accurate description of what's happening. I've
looked for something to back it up, but all I can find are unreferenced
comments on the web.

The onSubmit Event Handler is is used to execute specified JavaScript
code whenever the *user* submits a form.

I believe the problem you have is that Javascript aclling the submit()
function is *not* the same as the user submitting the form. Thus the
onSubmit handler is not invoked.

In fact, this is why you calling submit() in your onSubmit handler does
not cause an infinite loop.

The resolution would be an explicit call to formvalidation()
... something like:

<a class="save_menu"
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
formvalidation(document.Detail_Screen) &&
document.Detail_Screen.submit();">Update</>a>- Hide quoted text -

- Show quoted text -

Hi Dan,

Your suggestion seems to work. I had to change a few things. But
when I submit the form, it something fails the validation, it gives
the proper error message, but then a new page appears with only the
word 'false' on it........

On another note, I do not understand why sometimes I can refer to a
parameter by name, and other times I need parameter.value.........

Thanks again!!!

John

[Thomas 'PointedEars' Lahn]

Peter Michaux wrote:

On Jun 1, 4:53 pm, Dan Rumney <[e-mail]:

>><FORM name='Detail_Screen' action="savedata.php" METHOD="POST"
onsubmit='return formvalidation(this)'>
The problem is that the formvalidation routine is not being fired.
I'm at a loss here. Can anyone help us with this? At the end of the
javascript validation routine, we have this:
thisform.submit();

formvalidation should return TRUE or FALSE, depending on whether the
form's content is valid, or not.

JavaScript will type convert the return value of the onsubmit handler
to be a boolean. [...]

How would you know?
PointedEars
--
Prototype.js was written by people who don't know javascript for people
who don't know javascript. People who don't know javascript are not
the best source of advice on designing systems that use javascript.
-- Richard Cornford, cljs, <f8*******************@news.demon.co.uk>

[Dan Rumney]

On Jun 1, 11:25 pm, Mtek <[e-mail]:

On Jun 1, 9:49 pm, Dan Rumney <[e-mail]:

Here you go, and thanks!!

function formvalidation(thisform) {
if (emptyvalidation(thisform.CustName.value,"Customer Name is
empty")==false) {thisform.CustName.focus(); return false;};
if (emailvalidation(thisform.CustEmail.value,"Illegal E-
mail")==false) {thisform.CustEmail.focus(); return false;};

if (thisform.CellPhone.value==null || thisform.CellPhone.value==""
|| thisform.CellPhone.value==" ") {
thisform.CellPhone.value="000-000-0000";
} else {
if (phonevalidation(thisform.CellPhone.value,"Please enter a
valid cell phone")==false) {
thisform.CellPhone.focus(); return false;
};
};
thisform.submit();
}

Change "thisform.submit()" to "return true"

However, Reading you original post again, you wrote:

<a class="save_menu"
>

href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';

document.Detail_Screen.submit();">Update</>a>

[snip]

At the end of the javascript validation routine, we have this:
>
thisform.submit();
>
So, the form seems to submit, but not the way we want it to. We want
it to execute the validation routine first.

So, I think you're saying "Why isn't validation performed when the user
clicks on Update?"

So, I believe this is an accurate description of what's happening. I've
looked for something to back it up, but all I can find are unreferenced
comments on the web.

The onSubmit Event Handler is is used to execute specified JavaScript
code whenever the *user* submits a form.

I believe the problem you have is that Javascript aclling the submit()
function is *not* the same as the user submitting the form. Thus the
onSubmit handler is not invoked.

In fact, this is why you calling submit() in your onSubmit handler does
not cause an infinite loop.

The resolution would be an explicit call to formvalidation()
... something like:

<a class="save_menu"
href="javascript:document.Detail_Screen.action='sa vedata.php?screen=EDIT';
formvalidation(document.Detail_Screen) &&
document.Detail_Screen.submit();">Update</>a>- Hide quoted text -

- Show quoted text -

Hi Dan,

Your suggestion seems to work. I had to change a few things. But
when I submit the form, it something fails the validation, it gives
the proper error message, but then a new page appears with only the
word 'false' on it........

Try:
<a class="save_menu"
href="javascript:function()
{document.Detail_Screen.action='savedata.php?scree n=EDIT';
formvalidation(document.Detail_Screen) &&
document.Detail_Screen.submit();}">Update</a>

Or, better still
<span class="save_menu"
onClick="function(){document.Detail_Screen.action= 'savedata.php?
screen=EDIT';
formvalidation(document.Detail_Screen) &&
document.Detail_Screen.submit();}">Update</span>

Or, style a submit button as Peter suggests...

On another note, I do not understand why sometimes I can refer to a
parameter by name, and other times I need parameter.value.........

Probably best to start a new post for that question