Newbie: Uncheck checkbox upon error message

D

DesignerNut

I have a form with multiple checkboxes and a textbox storing a total
number of points.

By checking a checkbox, a specific point value (say 25pts) is deducted
from the total point value (1000 pts - 25 pts) and the textbox displays
the new point value.

Points are then added back to the textbox point value if the checkbox
gets unselected.

I got the script working fine up to that point.

My question is, once a checkbox is checked, the script checks to make
sure that the total point value is not less than 0 - if it is, it will
not
allow the points to be deducted. Once that part of the script runs, how
do I make sure the checkbox stays unselected?

Currently, if I select a checkbox that has a greater point value than
what remains in the total points value textbox, I get the alert message
saying "There are not enough points." but yet allows the checkbox to
show selected anyway.

How do I tell the checkbox to stay unchecked if this error checking
occurs?
 
D

Dietmar Meier

DesignerNut said:
Currently, if I select a checkbox that has a greater point value than
what remains in the total points value textbox, I get the alert
message saying "There are not enough points." but yet allows the
checkbox to show selected anyway.

How do I tell the checkbox to stay unchecked if this error checking
occurs?
Click to expand...

By returning false from the click event handler:

function deduct(oCheckbox) {
var oTotalText, nNewTotal, nMult;
if ((oTotalText = oCheckbox.form.elements["total"])) {
nMult = oCheckbox.checked? 1 : - 1;
nNewTotal = oTotalText.value - oCheckbox.value * nMult;
if (nNewTotal >= 0) {
oTotalText.value = nNewTotal;
return true;
}
else {
alert("There are not enough points.");
return false;
}
}
}
[...]
<form><p>
<input type="text" name="total" value="1000" disabled><br>
<input type="checkbox" value="25" onclick="return deduct(this)"> 25<br>
<input type="checkbox" value="50" onclick="return deduct(this)"> 50<br>
[...]
</p></form>

ciao, dhgm
 
R

RobB

DesignerNut said:
I have a form with multiple checkboxes and a textbox storing a total
number of points.

By checking a checkbox, a specific point value (say 25pts) is deducted
from the total point value (1000 pts - 25 pts) and the textbox displays
the new point value.

Points are then added back to the textbox point value if the checkbox
gets unselected.

I got the script working fine up to that point.

My question is, once a checkbox is checked, the script checks to make
sure that the total point value is not less than 0 - if it is, it will
not
allow the points to be deducted. Once that part of the script runs, how
do I make sure the checkbox stays unselected?

Currently, if I select a checkbox that has a greater point value than
what remains in the total points value textbox, I get the alert message
saying "There are not enough points." but yet allows the checkbox to
show selected anyway.

How do I tell the checkbox to stay unchecked if this error checking
occurs?
Click to expand...

Slightly different approach: skip the prompt and use disabling to
control input:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">

form {
width: 180px;
font: normal 11px verdana;
border: 1px #ccc dotted;
background: #eee;
}
input {
position: relative;
top: 3px;
font: normal 10px verdana;
text-align: center;
border: none;
background: #eee;
}

</style>
<script type="text/javascript">

function init()
{
var monitor = function()
{
if (!pboxes)
return;
var el, i = 0, tally = 0;
while (el = pboxes[i++])
{
if (el.checked)
{
tally += +el.value;
}
}
els.tally.value = (1000 - tally) + ' points';
i = 0;
while (el = pboxes[i++])
{
el.disabled = (!el.checked && tally + +el.value > 1000);
}
}

var el, i = 0,
els = document.forms.foo.elements;
this.pboxes = [];
while (el = els[i++])
{
if (el.className == 'points')
{
pboxes.push(el);
el.onclick = monitor;
}
}
}

window.onload = init;

</script>
</head>
<body>
<form id="foo">
<br>
<ol>
<li>
<input class="points" type="checkbox" name="deduct" value="25">~ deduct
25 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="25">~ deduct
25 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="50">~ deduct
50 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="50">~ deduct
50 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="100">~
deduct 100 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="100">~
deduct 100 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="250">~
deduct 250 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="250">~
deduct 250 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="300">~
deduct 300 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="300">~
deduct 300 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="350">~
deduct 350 pts.
</li>
<li>
<input class="points" type="checkbox" name="deduct" value="350">~
deduct 350 pts.
</li>
</ol>
<ul>
<li>
<input type="text" name="tally" value="1000 points" size="12"
readonly="readonly">
</li>
</ul>
</form>
</body>
</html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Clear Error Message Upon New Input on Form? 1
How do I push into an array using an event listener? 5
How can I hide a div using an event listener on multiple checkboxes? 6
Survey details won't go through using php, ajax, Mysql 0
Check/Uncheck all checkboxes with name as 'name[]' 1
I dont get this. Please help me!! 2
HCaptcha - How to stop page from refreshing on submit if captcha is not checked/validated 1
How can I remove the specific error message after regex validation is done? 1

Members online

Total: 30 (members: 2, guests: 28)
Robots: 376

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,016
Latest member
TatianaCha

Latest Threads

Top