| | |
Processing Checkbox Information From A Form
Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Thread Solved |
•
•
Join Date: Jun 2006
Posts: 2
Reputation:
Solved Threads: 0
Greetings,
I maintain a web page for the engineering department where I work and I was trying to make a humorous tool for the web page. Basically it is a form with three categories... Good/Fast/Cheap. Good meaning - a work product that is correct/accurate/etc. Fast meaning on or ahead of schedule. Cheap meaning on or under budget The user would select two of the three "work product" categories using checkboxes and then click on the submit button for the answer. Depending on what they checked would determine the output. If they didnt' check enough categories they would get an answer telling them to select another and resubmit. If they selected all three they would be given an answer indicating they must be in management because they want the job done good, fast and cheap. The truth is you can only have two categories... The work can be done good and fast but it won't be cheap, good and cheap but it won't be fast or fast and cheap but it won't be good. You get the idea.
I'm looking for some help from some javascript "mandarins". I'm struggling trying to figure out how to obtain a value from the checkbox in a form and then using that data with some if statements to output the right answer. Note that I can't use a <FORM> tag on the corporate server so the form is designated as "all".
Please accept my apologies if the code I have below is garbage - I'm a self taught html programmer and only dabble in javascript (which I find somewhat confusing).
Thanks in advance for any help anyone can provide.
Regards,
Chuck Bruce
Here's what I have (that's currently not working):
[HTML]
<SCRIPT LANGUAGE="JavaScript">
function calculate()
{
var g = document.all.g.value;
var f = document.all.f.value;
var c = document.all.c.value;
var g = 0;
var f = 0;
var c = 0;
if ( good == 1) { var g = 1 };
if ( fast == 3) { var f = 3 };
if ( cheap == 5) { var c = 5 };
var s = g + f + c;
if (var s == 0) { var ans = "Hey!, you need to select two categories."};
if (var s == 1) { var ans = "Hey!, you need to select another category."};
if (var s == 3) { var ans = "Hey!, you need to select another category."};
if (var s == 4) { var ans = "It'll be good and fast, but it won't be cheap!"};
if (var s == 5) { var ans = "Hey!, you need to select another category."};
if (var s == 6) { var ans = "It'll be good and cheap, but it won't be fast!"};
if (var s == 8) { var ans = "It'll be fast and cheap, but it won't be good!"};
if (var s == 9) { var ans = "You must be management - you want it good, fast *and* cheap!"};
document.all.ans.value=ans;
}
</SCRIPT>
<TABLE>
<TR>
<TD><BIG><B>Check two of the three options below and then click "Submit"</B></BIG>
<hr no shade size="2">
</TD>
</TR>
<TR>
<TD align="left" valign="top">
<INPUT TYPE="checkbox" NAME="good" value="1"> Good (i.e., accurate/correct/etc.)<br>
<INPUT TYPE="checkbox" NAME="fast" value="3"> Fast (i.e., on/ahead of schedule)<br>
<INPUT TYPE="checkbox" NAME="cheap" value="5"> Cheap (i.e., on/under budget)</TD>
</TR>
<TR>
<TD>
</TD>
</TR>
<TR>
<TD align="center" valign="top">
<INPUT TYPE=button VALUE="Submit" onClick="calculate()">
</TD>
</TR>
<TR>
<TD align="center">
<INPUT TYPE="text" NAME="ans" SIZE="100"><br>
</TD>
</TR>
</TABLE>
[/HTML]
I maintain a web page for the engineering department where I work and I was trying to make a humorous tool for the web page. Basically it is a form with three categories... Good/Fast/Cheap. Good meaning - a work product that is correct/accurate/etc. Fast meaning on or ahead of schedule. Cheap meaning on or under budget The user would select two of the three "work product" categories using checkboxes and then click on the submit button for the answer. Depending on what they checked would determine the output. If they didnt' check enough categories they would get an answer telling them to select another and resubmit. If they selected all three they would be given an answer indicating they must be in management because they want the job done good, fast and cheap. The truth is you can only have two categories... The work can be done good and fast but it won't be cheap, good and cheap but it won't be fast or fast and cheap but it won't be good. You get the idea.
I'm looking for some help from some javascript "mandarins". I'm struggling trying to figure out how to obtain a value from the checkbox in a form and then using that data with some if statements to output the right answer. Note that I can't use a <FORM> tag on the corporate server so the form is designated as "all".
Please accept my apologies if the code I have below is garbage - I'm a self taught html programmer and only dabble in javascript (which I find somewhat confusing).
Thanks in advance for any help anyone can provide.
Regards,
Chuck Bruce
Here's what I have (that's currently not working):
[HTML]
<SCRIPT LANGUAGE="JavaScript">
function calculate()
{
var g = document.all.g.value;
var f = document.all.f.value;
var c = document.all.c.value;
var g = 0;
var f = 0;
var c = 0;
if ( good == 1) { var g = 1 };
if ( fast == 3) { var f = 3 };
if ( cheap == 5) { var c = 5 };
var s = g + f + c;
if (var s == 0) { var ans = "Hey!, you need to select two categories."};
if (var s == 1) { var ans = "Hey!, you need to select another category."};
if (var s == 3) { var ans = "Hey!, you need to select another category."};
if (var s == 4) { var ans = "It'll be good and fast, but it won't be cheap!"};
if (var s == 5) { var ans = "Hey!, you need to select another category."};
if (var s == 6) { var ans = "It'll be good and cheap, but it won't be fast!"};
if (var s == 8) { var ans = "It'll be fast and cheap, but it won't be good!"};
if (var s == 9) { var ans = "You must be management - you want it good, fast *and* cheap!"};
document.all.ans.value=ans;
}
</SCRIPT>
<TABLE>
<TR>
<TD><BIG><B>Check two of the three options below and then click "Submit"</B></BIG>
<hr no shade size="2">
</TD>
</TR>
<TR>
<TD align="left" valign="top">
<INPUT TYPE="checkbox" NAME="good" value="1"> Good (i.e., accurate/correct/etc.)<br>
<INPUT TYPE="checkbox" NAME="fast" value="3"> Fast (i.e., on/ahead of schedule)<br>
<INPUT TYPE="checkbox" NAME="cheap" value="5"> Cheap (i.e., on/under budget)</TD>
</TR>
<TR>
<TD>
</TD>
</TR>
<TR>
<TD align="center" valign="top">
<INPUT TYPE=button VALUE="Submit" onClick="calculate()">
</TD>
</TR>
<TR>
<TD align="center">
<INPUT TYPE="text" NAME="ans" SIZE="100"><br>
</TD>
</TR>
</TABLE>
[/HTML]
Last edited by tgreer; Jun 8th, 2006 at 11:51 am. Reason: Poster forgot/ignored code tags.
•
•
Join Date: Jun 2006
Posts: 2
Reputation:
Solved Threads: 0
I was able to get help from a coworkers son on how to get my code to work (there's no way I would have ever figured it out myself!)...
Here it is...
[HTML]
<SCRIPT LANGUAGE="JavaScript">
function calculate()
{
var g = 0;
var f = 0;
var c = 0;
if (document.getElementById("g").checked) { g = 1 };
if (document.getElementById("f").checked) { f = 3 };
if (document.getElementById("c").checked) { c = 5 };
var s = g + f + c;
var ans = "Problem";
if ( s == 0) { ans = "Hey!, you need to select at least two categories."};
if ( s == 1) { ans = "Hey!, you need to also select either fast or cheap."};
if ( s == 3) { ans = "Hey!, you need to also select either good or cheap."};
if ( s == 4) { ans = "The work product will be good and fast, but it won't be cheap!"};
if ( s == 5) { ans = "Hey!, you need to also select either fast or good."};
if ( s == 6) { ans = "The work product will be good and cheap, but it won't be fast!"};
if ( s == 8) { ans = "The work product will be fast and cheap, but it won't be good!"};
if ( s == 9) { ans = "Come on! You can't have a work product that is all three!"};
document.getElementById("ans").value=ans;
}
</SCRIPT>
<TABLE>
<TR>
<TD><BIG><B>Check two of the three options below and then click the "Process" button.</B></BIG>
<hr no shade size="2">
</TD></TR>
<TR>
<TD align="left" valign="top">
<INPUT TYPE="checkbox" ID="g"> Good (i.e., accurate/correct/etc.)<br>
<INPUT TYPE="checkbox" ID="f"> Fast (i.e., on/ahead of schedule)<br>
<INPUT TYPE="checkbox" ID="c"> Cheap (i.e., on/under budget)</TD>
</TR>
<TR>
<TD>
</TD>
</TR>
<TR>
<TD align="center" valign="top">
<INPUT TYPE=button VALUE="Process" onClick="calculate()">
</TD>
</TR>
<TR>
<TD align="center">
<INPUT TYPE="text" ID="ans" SIZE="75"><br>
</TD>
</TR>
</TABLE>[/HTML]
Here it is...
[HTML]
<SCRIPT LANGUAGE="JavaScript">
function calculate()
{
var g = 0;
var f = 0;
var c = 0;
if (document.getElementById("g").checked) { g = 1 };
if (document.getElementById("f").checked) { f = 3 };
if (document.getElementById("c").checked) { c = 5 };
var s = g + f + c;
var ans = "Problem";
if ( s == 0) { ans = "Hey!, you need to select at least two categories."};
if ( s == 1) { ans = "Hey!, you need to also select either fast or cheap."};
if ( s == 3) { ans = "Hey!, you need to also select either good or cheap."};
if ( s == 4) { ans = "The work product will be good and fast, but it won't be cheap!"};
if ( s == 5) { ans = "Hey!, you need to also select either fast or good."};
if ( s == 6) { ans = "The work product will be good and cheap, but it won't be fast!"};
if ( s == 8) { ans = "The work product will be fast and cheap, but it won't be good!"};
if ( s == 9) { ans = "Come on! You can't have a work product that is all three!"};
document.getElementById("ans").value=ans;
}
</SCRIPT>
<TABLE>
<TR>
<TD><BIG><B>Check two of the three options below and then click the "Process" button.</B></BIG>
<hr no shade size="2">
</TD></TR>
<TR>
<TD align="left" valign="top">
<INPUT TYPE="checkbox" ID="g"> Good (i.e., accurate/correct/etc.)<br>
<INPUT TYPE="checkbox" ID="f"> Fast (i.e., on/ahead of schedule)<br>
<INPUT TYPE="checkbox" ID="c"> Cheap (i.e., on/under budget)</TD>
</TR>
<TR>
<TD>
</TD>
</TR>
<TR>
<TD align="center" valign="top">
<INPUT TYPE=button VALUE="Process" onClick="calculate()">
</TD>
</TR>
<TR>
<TD align="center">
<INPUT TYPE="text" ID="ans" SIZE="75"><br>
</TD>
</TR>
</TABLE>[/HTML]
Last edited by tgreer; Jun 9th, 2006 at 3:18 pm. Reason: user ignored code tags AGAIN!!
![]() |
Similar Threads
- receiving data from a form in PHP? (PHP)
- Help with asp form will not display contact information (ASP)
- VB.NET do not allow Msflexgrid on form (VB.NET)
- recordset from multiple checkbox values (ASP)
- Help with printing mulitple documents in js...! (HTML and CSS)
- AGP Aperture Size Question (Windows NT / 2000 / XP)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Javascript error in Firefox (Mac OS X)
- Next Thread: Passing variables to and from PHP
Views: 4557 | Replies: 2
| Thread Tools | Search this Thread |
Tag cloud for JavaScript / DHTML / AJAX
ajax ajaxcode ajaxhelp animate api attributes automatically beta boarder box bug button calendar card checkbox child class column cookies createrange() css cursor disablefirebug dom download dropdown editor element engine error events explorer file firehose flash form forms google gwt html htmlform ie8 iframe image() images internet java javascript jawascriptruntimeerror jquery jsf jsfile jump margin math matrixcaptcha microsoft mimic mp3 mysql object offline onmouseoutdivproblem onreadystatechange parent passing php player post problem progressbar rated rating refresh regex runtime scroll search select session shopping size sql star stars stretch text textarea twitter validation w3c web website window windowofwords windowsxp wysiwyg xml xspf \n






