Library code snippets

Multiple Submit Buttons

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...

Comments

  1. 01 Jan 1999 at 00:00

    This thread is for discussions of Multiple Submit Buttons.

Leave a comment

Sign in or Join us (it's free).

Kiran Pai

Related podcasts

  • jQuery in ASP.NET

    In this episode Chris Brandsma, Rick Strahl, Dave Ward, Bertrand Le Roy, Scott Koon, and Steven Harman discuss Microsoft's jQuery in ASP.NET announcement.This episode of the Alt.NET Podcast is brought to you by LLBLGen Pro, the most mature O/R mapper and code generator out there.Are you loo...

Events coming up

  • Dec 8

    December Silicon Valley Ruby Meetup

    Moffett Field, United States

    In a World of Middleware, Who Needs Monolithic Applications? by Jon Crosby With Rack emerging as the standard for composing web applications and services, most recently with Rails adoption, an architectural shift is taking place. Learn how to create next generation web services by reusing existing Rack middleware and supplementing with your own components and micro-frameworks like Sinatra. Bio : Jon likes music, the Open Web, Ruby, Erlang, Haskell, Objective-C, JavaScript and coffee.

Want to stay in touch with what's going on? Follow us on twitter!