Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations Shaun E on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Automatic calculation in text fields 1
- Thread starter ateo
- Start date
first calcuations use the parseInt and parseFloat functions for data type conversions before that arrises in the script.
you can use key events or a onBlur of the forth textbox to run a function auto (dynamicaly)
eg:
<script language="javascript">
function hi() {
alert("hello!"
;
}
</script>
<input type="text" name="txt" onBlur="hi()">
when the box loses focus the function runs.
you can see the key events here
along with the onBlur referenced a bit more
_________________________________________________________
$str = "sleep is good for you. sleep gives you the energy you need to function";
$Nstr = ereg_replace("sleep","coffee",$str); echo $Nstr;
[/sub]
you can use key events or a onBlur of the forth textbox to run a function auto (dynamicaly)
eg:
<script language="javascript">
function hi() {
alert("hello!"
;}
</script>
<input type="text" name="txt" onBlur="hi()">
when the box loses focus the function runs.
you can see the key events here
along with the onBlur referenced a bit more
_________________________________________________________
$str = "sleep is good for you. sleep gives you the energy you need to function";
$Nstr = ereg_replace("sleep","coffee",$str); echo $Nstr;
-
1
- #3
Try this:
I recommend parseFloat() since it does not parse numbers entered with preceeding zeros as octal values. Also, you have to keep the exact captialization in JavaScript. The function parseFloat() works but not parsefloat().
For textboxes 1-4 you can use <INPUT ... ONBLUR="return sum_boxes('textbox')">. I added the parameter only in case you wanted to test differently at the entrybox level versus the submit level.
Also, for textbox5 use noedit="noedit" in the <INPUT> tag so that the user cannot edit the sum displayed.
Code:
function sum_boxes(callfrom)
{
var e = document.formname.length;
var tot=0;
var i;
for (i=0; i < e; i++)
{
// scan all form elements to find what we need
var n=document.formname.elements[i].name;
var v=document.formname.elements[i].value;
if (n.substr(0,7) == "textbox" && v.length != 0)
{
if (0 < v)
{
tot += parseFloat(v)
}
}
}
document.formname.textbox5.value=tot
}I recommend parseFloat() since it does not parse numbers entered with preceeding zeros as octal values. Also, you have to keep the exact captialization in JavaScript. The function parseFloat() works but not parsefloat().
For textboxes 1-4 you can use <INPUT ... ONBLUR="return sum_boxes('textbox')">. I added the parameter only in case you wanted to test differently at the entrybox level versus the submit level.
Also, for textbox5 use noedit="noedit" in the <INPUT> tag so that the user cannot edit the sum displayed.
- Thread starter
- #4
dbMark,
This is what I did:
<script language="JavaScript" type="text/javascript">
function sum_boxes(callfrom)
{
var e = document.theform.length;
var tot=0;
var i;
for (i=0; i < e; i++)
{
// scan all form elements to find what we need
var n=document.theform.elements.name;
var v=document.theform.elements.value;
if (n.substr(0,7) == "textbox" && v.length != 0)
{
if (0 < v)
{
tot += parseFloat(v)
}
}
}
document.theform.Total.value=tot
}
</script>
...
<input type="text" name="value1" size="10" class="edit"
onblur="return sum_boxes("textbox""><br>
<input type="text" name="value2" size="10" class="edit"
onblur="return sum_boxes("textbox""><br>
<input type="text" name="value3" size="10" class="edit"
onblur="return sum_boxes("textbox""><br>
<input type="text" name="value4" size="10" class="edit"
onblur="return sum_boxes("textbox""><br>
<input class="edit" type="text" name="Total" noedit="noedit" size="10">
...
The value did not add up. It just showed "0" in textbox 5-- "Total". I don't know which part I did wrong. Any help is greatly appreciated! Thanks.
This is what I did:
<script language="JavaScript" type="text/javascript">
function sum_boxes(callfrom)
{
var e = document.theform.length;
var tot=0;
var i;
for (i=0; i < e; i++)
{
// scan all form elements to find what we need
var n=document.theform.elements.name;
var v=document.theform.elements.value;
if (n.substr(0,7) == "textbox" && v.length != 0)
{
if (0 < v)
{
tot += parseFloat(v)
}
}
}
document.theform.Total.value=tot
}
</script>
...
<input type="text" name="value1" size="10" class="edit"
onblur="return sum_boxes("textbox"
"><br><input type="text" name="value2" size="10" class="edit"
onblur="return sum_boxes("textbox"
"><br><input type="text" name="value3" size="10" class="edit"
onblur="return sum_boxes("textbox"
"><br><input type="text" name="value4" size="10" class="edit"
onblur="return sum_boxes("textbox"
"><br><input class="edit" type="text" name="Total" noedit="noedit" size="10">
...
The value did not add up. It just showed "0" in textbox 5-- "Total". I don't know which part I did wrong. Any help is greatly appreciated! Thanks.
dbMark,
are you aware that you can specify the radix with parseInt() to prevent "025" from being treated as octal?
parseInt("025", 10);
the radix you specify determines how the number is treated...
parseInt("11", 2)
"11" will be treated as binary and will return 3.
=========================================================
try { succeed(); } catch(E) { tryAgain(); }
-jeff
are you aware that you can specify the radix with parseInt() to prevent "025" from being treated as octal?
parseInt("025", 10);
the radix you specify determines how the number is treated...
parseInt("11", 2)
"11" will be treated as binary and will return 3.
=========================================================
try { succeed(); } catch(E) { tryAgain(); }
-jeff
ateo: One reason why it didn't work is that you can't nest double quotes like that. Try nesting single quotes inside the double quotes this way and try again:
onblur="return sum_boxes('textbox')"
You may not need to send any parameter if you're only using the code one way. I included it just in case you wanted to handle the individual textboxes slightly differently from the SUBMIT logic.
jemminger: Thanks for the explanation. I have a huge book which does NOT show that "radix" parameter for parseInt() so I didn't even know what a radix was or what the 10 meant. I had guessed wrongly that it was 10 digits or spaces, oops. I'll write it in the margin with all my other notes. Did cryptographers write Javascript?
onblur="return sum_boxes('textbox')"
You may not need to send any parameter if you're only using the code one way. I included it just in case you wanted to handle the individual textboxes slightly differently from the SUBMIT logic.
jemminger: Thanks for the explanation. I have a huge book which does NOT show that "radix" parameter for parseInt() so I didn't even know what a radix was or what the 10 meant. I had guessed wrongly that it was 10 digits or spaces, oops. I'll write it in the margin with all my other notes. Did cryptographers write Javascript?
dbMark,
maybe time for a new reference...i use o'reilly's "javascript: the definitive guide"
no cryptographers - just programmers, and you know how well we document and comment our own code, right? ;-)
=========================================================
try { succeed(); } catch(E) { tryAgain(); }
-jeff
maybe time for a new reference...i use o'reilly's "javascript: the definitive guide"
no cryptographers - just programmers, and you know how well we document and comment our own code, right? ;-)
=========================================================
try { succeed(); } catch(E) { tryAgain(); }
-jeff
- Thread starter
- #8
ateo: I see that the names of your textboxes are value1,2,3,4. In the sample I gave I looped through all form elements looking for only variables whose names started with "textbox" such as textbox1, textbox2, etc. You are using names starting with "value". In that case, you need to search for the name you are using. By the way, for this reason none of the other form elements should begin with the same letters so you don't mess up the total routine.
replace:
with:
JavaScript is very picky and browsers seldom tell you where the problem is. Just never give up. Sometimes I find that when I make one small change, I spend a lot of time making the rest of the code work with that change. The nature of the beast...
One other note, while posting all these messages, I learned something too, that these 2 lines will give the same results:
At first the "parseInt(v)" code didn't always work as expected for me since entries beginning with a zero such as "0123" were being interpreted as octal numbers in base 8. I didn't realize that and so I didn't mention it earlier. But since then I was told that adding another parameter, a "radix", into the function so that it was "parseInt(v,10)" forced the value to be interpreted as base 10, our everyday decimal system. Another problem solved.
jemminger: Too bad my steeply discounted book forgot to include that little detail on parseInt()'s extra parameter. It's a 2001 $49.99 book with 1079 pages and named "Javascript: The Complete Reference" by Osborne/McGraw-Hill. This is the second error or omission I've found in the book. The other was on page 430 where the "maxlength" INPUT property should be "maxLength".
replace:
Code:
if (n.substr(0,7) == "textbox" && v.length != 0)
Code:
if (n.substr(0,5) == "value" && v.length != 0)JavaScript is very picky and browsers seldom tell you where the problem is. Just never give up. Sometimes I find that when I make one small change, I spend a lot of time making the rest of the code work with that change. The nature of the beast...
One other note, while posting all these messages, I learned something too, that these 2 lines will give the same results:
Code:
tot += parseFloat(v);
tot += parseInt(v,10);At first the "parseInt(v)" code didn't always work as expected for me since entries beginning with a zero such as "0123" were being interpreted as octal numbers in base 8. I didn't realize that and so I didn't mention it earlier. But since then I was told that adding another parameter, a "radix", into the function so that it was "parseInt(v,10)" forced the value to be interpreted as base 10, our everyday decimal system. Another problem solved.
jemminger: Too bad my steeply discounted book forgot to include that little detail on parseInt()'s extra parameter. It's a 2001 $49.99 book with 1079 pages and named "Javascript: The Complete Reference" by Osborne/McGraw-Hill. This is the second error or omission I've found in the book. The other was on page 430 where the "maxlength" INPUT property should be "maxLength".
- Thread starter
- #10
- Status
Similar threads
- Locked
- Question
- Locked
- Question
- Locked
- Question