By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,934 Members | 1,441 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,934 IT Pros & Developers. It's quick & easy.

Preview and submit button on same form

P: 32

I have this form - test page here:

I have a button at the top of the page which I use to post data to the page to refresh the SWF content. I use a button to call the page, rather than the "action" property of the form.

This is the button:

Expand|Select|Wrap|Line Numbers
  1. <button type="button" value="Refresh ecard above with your own content &raquo;" id="button0" name="button0" onclick="return onbutton0();">Refresh ecard above with your own content &raquo;</button>
The corresponding javascript looks like this:

Expand|Select|Wrap|Line Numbers
  1. function onbutton0()
  2. {
  3.     document.theForm.action = "normal-ecard.asp?id=<%=e%>&tag=<%=tag%>&c=<%=c%>#swf"
  4.     document.theForm.submit();             // submit the page
  5.     return true;
  6. }
Then there's a "Preview" button at the bottom - a regular "submit" button, which calls a javascript function to validate the form input, called via this in the form HTML:
Expand|Select|Wrap|Line Numbers
  1. <form method="post" action="preview.asp" name="theForm" id="theForm" style="padding:0px; border:0px;" onsubmit="return valForm(this)">
Usually people have to preview the ecard before sending it, but I'd like to add an option to allow people to send right away, without the preview bit.

However, I can't see how to do it, because the action on the form is to send the user to "preview.asp".

The page to send directly is called "process.asp".

However, I can't just add this:

Expand|Select|Wrap|Line Numbers
  1. function onbuttontest()
  2. {
  3.     document.theForm.action = "process.asp"
  4.     document.theForm.submit();             // submit the page
  5.     return true;
  6. }

And this:

Expand|Select|Wrap|Line Numbers
  1. <button type="button" value="Send Immediately" id="onbuttontest" name="onbuttontest" onclick="return onbuttontest();">Send Immediately</button>
Because then the form validation function (valForm) will not be called.

I tried this:

Expand|Select|Wrap|Line Numbers
  1. <button type="button" value="Send Immediately" onclick="return valForm(this)">Send Immediately</button>
But that doesn't work...

I wonder if there is a way I can do it. It'd be better to be able to choose from 2 different action destinations on the form - one for process.asp, the other for preview.asp, but to be able to to use this property of the form:

Expand|Select|Wrap|Line Numbers
  1. onsubmit="return valForm(this)"
To be able to run the validation code.

I know that's not possible - I can see what I'd like to do, but don't know how to achieve it. In fact, this form on this newthread page does what I'd like to do - there is a preview and submit button, but clicking either calls the form validation javascript.

Any advice much appreciated.

Feb 4 '12 #1
Share this Question
Share on Google+
2 Replies

Expert Mod 15k+
P: 16,027
Remove the submit() call to let the validation and form submit take place via onsubmit and the button code can set the form action only.
Feb 27 '12 #2

P: 1
I think you need to add
onsubmit="return valForm(this)" into onsubmit="return valForm(this);"

It might work.
Feb 15 '13 #3

Post your reply

Sign in to post your reply or Sign up for a free account.