Home » Javascript » Article
Multiple submit buttons on a single form
|
| Article by: | Kiran Pai
(6/25/2002) |
|
| Sponsored by: | FindMyHosting - Web Hosting Search |
| Summary: | This script shows you how to submit the contents of a form to different programs depending on which Submit button you press. Additionally it also shows how to call two different functions when you press the Submit button. |
|
| Viewed: 86787 times |
Rating (59 votes): |
|
3.7 out of 5 |
|
|
|
by Kiran Pai (Kiran Pai's Web Site)
This script shows you how to submit the contents of a form to different programs depending on which Submit button you press. Additionally it also shows how to call two different functions when you press the Submit button.
When you press submit on this script it first sets the variable totalboxes = 2, then it also sets the target for the form using the 3 if conditions stated. Then it calls the isReady() function and checks to see if atleast one checkbox has been checked. If even one is checked then it returns true and this causes the contents to be submitted to either program1.jsp or program2.jsp or program3.jsp. If even one checkbox wasn't checked you would be notified with a alert dialog box.
<SCRIPT LANGUAGE = "JavaScript">
<!--
var totalboxes;
function setCount(count, target){
totalboxes=count;
// the next 3 lines are the main lines of this script
//remember to leave action field blank when defining the form
if(target == 0) document.myform.action="program1.jsp";
if(target == 1) document.myform.action="program2.jsp";
if(target == 2) document.myform.action="program3.jsp";
}
function isReady(form) {
for(var x=0 ; x<totalboxes ; x++){
//if even one box is checked then return true
if(myform.boxes[x].checked) return true;
}
//default action : When even one was not checked then..
alert("Please check at least one checkbox..");
return false;
}
//-->
</SCRIPT>
<BODY>
<FORM onSubmit="return isReady(this)" METHOD="post" NAME="myform" ACTION="">
<INPUT TYPE="checkbox" NAME="boxes" VALUE="box1">Box 1 <BR>
<INPUT TYPE="checkbox" NAME="boxes" VALUE="box2">Box 2 <BR>
<INPUT TYPE="checkbox" NAME="boxes" VALUE="box2">Box 3 <BR>
<INPUT TYPE="checkbox" NAME="boxes" VALUE="box2">Box 4 <BR>
<INPUT TYPE="checkbox" NAME="boxes" VALUE="box2">Box 5 <BR>
</FORM>
<INPUT TYPE="image" onClick="setCount(5,0)"
NAME="Submit1" VALUE="delete" SRC="delete_icon.jpg">
<INPUT TYPE="image" onClick="setCount(5,1)"
NAME="Submit2" VALUE="view" SRC="view_icon.jpg">
<INPUT TYPE="image" onClick="setCount(5,2)"
NAME="Submit3" VALUE="modify" SRC="modify_icon.jpg">
</BODY>
| |
|
The setCount() take 2 parameters, the no of checkboxes and the target program to which the contents have to be submitted to.
Note : Sending the variable 5 for no of boxes using the onClick() event is useful in case you are not knowing the no. of checkboxes while writing the top part of the html page (while writing the script part at the top of the page). This may happen in case you are dynamically creating this html page then you may not know how many checkboxes would be present in the beginning. Basically this thing becomes useful since the dynamic languages such as ASP or JSP would generate the page line by line and at that time you would first generate the script part and then the actual checkboxes on the page. So you would not be able to set the value of totalboxes to a finite number before actually adding all the checkboxes to the page. You could use a counter (within ASP/JSP) which keeps track of the checkboxes you add to the html page and finally set the value of that counter as a parameter to this onClick() function.
You could avoid this by typing the Script at the bottom of the page, but that doesn't work with a few browsers. In case you haven't got the point, its ok.. Just understand how to submit the form to different programs. You can leave the checkbox part...
|
|
View highlighted Comments
 User Comments on 'Multiple submit buttons on a single form'
|
Posted by :
 Archive Import (AMC) at 08:23 on Friday, August 09, 2002
|
Is missing some code as far as I can see
after
if(target == 2) document.myform.action="program3.jsp";
needs
document.myform.submit();
Otherwise didn‹t work in IE 5
| |
|
Posted by :
Archive Import (kamal) at 05:53 on Tuesday, September 10, 2002
|
Thanks a lot its really helps me a lot!!
Its really great!!
| |
|
Posted by :
Archive Import (Rob) at 08:45 on Wednesday, September 25, 2002
|
Excellent post! Thanks! Also thanks to AMC for the missing code!
| |
|
Posted by :
Archive Import (rajesh) at 05:08 on Friday, October 18, 2002
|
i would rate as best article displaying all the user needed. thanx buddy
| |
|
Posted by :
Archive Import (JC) at 01:32 on Saturday, November 09, 2002
|
Okay, what if you only want a single submit button on the form, that will take one to a different url, depending on what checkbox/choice was selected?
Example: if you are from state x, y, or z, submit sends you to url 1, but if you are from state a, b, or c, submit sends you to url 2?
(Not a programmer, just need a script like that to plug into a website.)
| |
|
Posted by :
Archive Import (ivy) at 22:55 on Friday, November 29, 2002
|
i have a problem. in a form, i have numerous submit buttons and textboxes. for example, submit button1 has a corresponding textbox1 until submit button9. what i want to do is that when submit button1 is clicked, it checks(form validation) if textbox1 is null or not. it should disregard the other textboxes. and the same thing should go for submit button2, 3...til 9.
what i've done so far is that when it clicks on submit button1, it checks if all textboxes(from 1 - 9) are null or not.
please help!!
please send your solutions / comments to my email address .... thank u!
| |
|
Posted by :
Archive Import (happypappy) at 12:46 on Thursday, December 05, 2002
|
This is giving me ideas, thanx. I am using 3GL code to build a web front-end for a mainframe application. User Info has to be entered and validated with databases then info is passed back to be verified. The "verify" screen should give the user some options; "BACK" "VALIDATE" "ACCEPT" based off a button.
"BACK" would go to PGMA
"VALIDATE" would go to PGMB (current)
"ACCEPT" would go to PGMC
Any mainframers out there tried this?
Yes this is cumbersome but it is what we have.
| |
|
Posted by :
Archive Import (Todd Bacon) at 11:40 on Friday, December 20, 2002
|
do you have a sample of this in vbScript? I'm not to comfortable with Java.
| |
|
Posted by :
Archive Import (afaque) at 15:25 on Friday, January 10, 2003
|
tell me plz where THe data can me mailed to some particular email id
while we click on submit button
is it possible
if yest then plz send me the code
bye
| |
|
Posted by :
Archive Import (dude) at 22:38 on Tuesday, March 04, 2003
|
onSubmit="return isReady(this)" doesn't seem to work without a type=submit button.
hence the form will submit without validating (IE 5.5)
totalboxes=count should be in function isReady, and the "count" argument should be in the function isReady(form) signature ie. function isReady(form, count)
| |
|
Posted by :
Archive Import (rob) at 11:20 on Wednesday, April 16, 2003
|
Hope this helps you afaque - providing CDONTS is enabled on your server it should.
(don't forget to do Call Sub :-) )
Sub SendEmail
Dim objMail
Set objMail = CreateObject("CDONTS.NewMail")
objMail.From = "You@YourMail.com"
objMail.To = VarRecipient
objMail.Subject = "Subject Of Mail"
objMail.Body = VarBodyOfEmail
objMail.Send
Set objMail = Nothing
End Sub
| |
|
Posted by :
Archive Import (Cheaca) at 23:49 on Tuesday, April 29, 2003
|
Are there any other ways besides sending the gathered data from your users to your e-mail? Does this always work? What are the other alternatives? Please help me... thanks heaps
| |
Posted by :
 geekme at 19:58 on Tuesday, March 30, 2004
|
CJ above asked if anybody knew how to redirect form based on choices made in select boxes or radio buttons - did any body post a reply to hime someplace else?
I need to ask visitors to select check, creditcard or invoice and then, if they selected creditcard - redirect them to my verisign link but if they select anything else - I take them to an instructions page.
Can anybody help a newbie wanna be geek out?
| |
|
Posted by :
Micho at 14:27 on Tuesday, April 20, 2004
|
Brilliant - answered 2 of my questions. Thanks so much
| |
|
Posted by :
b_manish at 08:04 on Tuesday, March 15, 2005
|
1>I want to check if the dynamically generated check boxes are checked or not.
2>Based on this i want to add the records in database
| |
|
To post comments you need to become a member. If you are already a member, please log in .
 
| RELATED ARTICLES |
Javascript Onload Event
by Jeff Anderson
Sometimes you need to perform an action immediatley after the page has loaded. That's when the onLoad Event Handler comes in handy |
 |
Javascript - Enable and Disable form elements
by Jeff Anderson
This is a relatively little known and under-used feature of javascript which can be very useful in guiding a user through a form. Using the disabled tag, you can switch on and off elements in a form. |
|
Form Validation Function
by Jeff Anderson
A javascript validation function that you can use to validate all types of forms. |
|
Check IsNumeric Function
by Jeff Anderson
A javascript validation function to check whether the details entered by a user are numeric. |
|
JavaScript Field Is Empty Form Validation
by Jeff Anderson
This javascript function allows you to check whether a form field has been completed or not. |
|
Check Email Validation Function
by Jeff Anderson
A javascript validation function to check whether the user has entered a valid email address in a form. |
|
Multiple submit buttons on a single form
by Kiran Pai
This script shows you how to submit the contents of a form to different programs depending on which Submit button you press. Additionally it also shows how to call two different functions when you press the Submit button. |
|
Validate Form and Disable Submit Button
by Marylou Marks
I have a form that validates info, but I also want to disable the submit button. The disable part worked before adding the form validating. |
|
Simple date validation
by Chris Hogben
function that takes a date in three parts, day, month and year - returns true if it's a valid date. |
|
Multiple submit buttons with form validation
by Paul Eckert
This code shows how to redirect a user to multiple sites, depending on which submit button he presses, but only after the form validates correctly. |
|
| |
