angst 12-16-2005, 05:44 PM Hi,
I'm wondering how I can add numbers in real time using javascript.
example,
say I enter a number in a text field,
<input type="text" name="qty" value="2">
<input type="text" name="cost" value="5">
how would I then be able to get the total in another test field, like:
<input type="text" name="total" value="10">
hope someone understands what I'm trying to do here.
any help would be great!
thanks in advance for your time!
-ken
jalarie 12-16-2005, 05:59 PM <input type="text" name="qty" value="2">
<input type="text" name="cost" value="5" onblur="document.forms[0].total.value = document.forms[0].qty.value*1 + document.forms[0].cost.value*1;">
<input type="text" name="total" value="10">
angst 12-16-2005, 06:15 PM hmm, that doesn't seem to do anything,
unless I'm missing something?
thanks again,
-Ken
jalarie 12-16-2005, 06:24 PM These three lines need to be within <form> </form> tags. I tested it on a WinXP machine running Firefox.
vwphillips 12-16-2005, 06:32 PM very prone to typing errors
this makes some attempt to catch
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
function Add(){
var q=document.forms[0].qty;
var c=document.forms[0].cost;
var t=document.forms[0].total;
if (isNaN(q.value)||isNaN(c.value)){
q.value=q.value.replace(/\D/g,'');
c.value=c.value.replace(/\D/g,'');
alert('Only Numbers Allowed');
}
if (q.value.length>0&&c.value.length>0){
t.value=parseInt(q.value)+parseInt(c.value);
}
}
//-->
</script>
</head>
<body>
<form >
<input type="text" name="qty" value="2" onkeyup="Add();" >
<input type="text" name="cost" value="5" onkeyup="Add();" >
<input type="text" name="total" value="10">
</form>
</body>
</html>
angst 12-16-2005, 06:36 PM ah
perfect!:cool:
thanks again for you help!
-Ken
Ancora 12-16-2005, 06:47 PM Ignored, so deleted.
angst 12-16-2005, 06:47 PM ok one more question,
what if I had a drop down <select> to add another number option in?
like
<script language="JavaScript" type="text/javascript">
<!--
function Add(){
var q=document.forms[0].tax;
var q=document.forms[0].qty;
var c=document.forms[0].cost;
var t=document.forms[0].total;
if (isNaN(q.value)||isNaN(c.value)){
q.value=q.value.replace(/\D/g,'');
c.value=c.value.replace(/\D/g,'');
alert('Only Numbers Allowed');
}
if (q.value.length>0&&c.value.length>0){
t.value=parseInt(q.value)+parseInt(c.value);
}
}
//-->
</script>
</head>
<body>
<form >
tax:
<select name="tax">
<option value="">none</option>
<option value="5.0">5%</option>
<option value="10.0">10%</option>
<option value="15.0">15%</option>
</select>
<br />
qty:
<input type="text" name="qty" value="2" onkeyup="Add();" /><br />
cost:<input type="text" name="cost" value="5" onkeyup="Add();" /><br />
Total:<input type="text" name="total" value="10">
</form>
sorry for all the questions, i'm new with javascript.
thanks again,
-Ken
angst 12-16-2005, 06:58 PM hmm,
tried this:
<script language="JavaScript" type="text/javascript">
<!--
function Add(){
var tx=document.forms[0].tax;
var q=document.forms[0].qty;
var c=document.forms[0].cost;
var t=document.forms[0].total;
if (isNaN(q.value)||isNaN(c.value)){
q.value=q.value.replace(/\D/g,'');
c.value=c.value.replace(/\D/g,'');
alert('Only Numbers Allowed');
}
if (q.value.length>0&&c.value.length>0){
temp.value=parseInt(q.value)+parseInt(c.value);
t.value=temp.value * parseInt(tx.value) / 100 + temp.value;
}
}
//-->
</script>
but no luck, doesn't work at all now.
angst 12-16-2005, 07:08 PM ok,
I've got it working,
just one last question,
how can I make the total update if I select the tax last.
my code:
<script language="JavaScript" type="text/javascript">
<!--
function Add(){
var tx=document.forms[0].tax;
var q=document.forms[0].qty;
var c=document.forms[0].cost;
var t=document.forms[0].total;
if (isNaN(q.value)||isNaN(c.value)){
q.value=q.value.replace(/\D/g,'');
c.value=c.value.replace(/\D/g,'');
tx.value=tx.value.replace(/\D/g,'');
alert('Only Numbers Allowed');
}
if (q.value.length>0&&c.value.length>0){
temp=parseInt(q.value) * parseInt(c.value);
t.value = temp * tx.value / 100 + temp;
}
}
//-->
</script>
</head>
<body>
<form >
<select name="tax" onkeyup="Add();">
<option value="0">non</option>
<option value="5">5</option>
<option value="10">10</option>
<option value="15">15</option>
</select>
<br />
qty:<input type="text" name="qty" value="" onkeyup="Add();" /><br />
cost:<input type="text" name="cost" value="" onkeyup="Add();" /><br />
total:<input type="text" name="total" value="">
</form>
I tried adding onkeyup="Add();" to the select, but it doesn't seem to work.
any ideas?
thanks again!
-Ken
angst 12-16-2005, 07:17 PM ok, I got it,
using
onChange="Add();"
;)
-Ken
|
|
