2. PHPRunner General questions
  3. how to calculate fields in real time
This topic is locked

how to calculate fields in real time

 		4/9/2009 9:14:40 PM
PHPRunner General questions
R
 racerx author

Hello Everyone,
need some help I have a form with fields for example first row is MON1,MON2,MON3,MON4,MON5,MON6,MON7,MON8,MON9,MON10,MON11,AND MTOT is the total

field .I have looked and found some examples to use javascript for this but just don't get how to incorporate it the rest of the fields in my form are the same just substitute the MON for the next day so my next row of fields is TUE1,TUE2 and so on so how do go about using javascript to do realtime calculation on my form thanks in advance.
racerx
J
 		Jane 4/10/2009

Hi,
here is just a sample:

<script>

var x = document.editform.value_MON1;

var y = document.editform.value_MON2;

x.onchange = x.onkeyup = y.onchange = y.onkeyup = function()

{

document.editform.value_MTOT.value = document.editform.value_MON1.value + document.editform.value_MON2.value;

}

</script>
R
 		racerx author 4/10/2009

Hi,

here is just a sample:


Hello Jane ,
Thanks for the sample code it is working but my total is coming up wrong if I put in 8 MON1 filed and 8 in MON2 filed I'm getting 88 in the MTOT it should be 16 also I see var x and var y if I add another field can I put any letter for my var so the next would be var a var b and so on can you please shed some light on that thanks for the help appreciate it .
racerx
J
 		Jane 4/10/2009

Hi,
use toFixed() function:

var mon1 = document.editform.value_MON1.value;

var mon2 = document.editform.value_MON2.value;

document.editform.value_MTOT.value = mon1.toFixed() + mon2.toFixed();



More info here:

http://www.w3schools.com/jsref/jsref_tofixed.asp
R
 		racerx author 4/10/2009

Hi,

use toFixed() function:
More info here:

http://www.w3schools.com/jsref/jsref_tofixed.asp


Hello Jane,
I'm confused but thats not new but I read the info on the link you posted and from what I read is this fuctions rounds numbers but All I want ot do is add the numbers I'm entering into the fields and come up witH a total MON1+MON2+MON3,+MON4,+MON5+MON6,+MON7,+MON8,+MON9,+MON10,+MON11 =MTOT.Sorry for all the questions but I'm getting there any hel would be great thanks in advance.
racerx
Sergey Kornilov admin 4/10/2009

racerx,
toFixed() function converts strings to numbers so it can summed properly. If you don't convert strings to numbers it concatenate strings ( 8 + 8 = 88 instead of 8 + 8 = 16).
R
 		racerx author 4/11/2009

racerx,

toFixed() function converts strings to numbers so it can summed properly. If you don't convert strings to numbers it concatenate strings ( 8 + 8 = 88 instead of 8 + 8 = 16).


Hello Thanks ,
For taking the time to answer my questions I have inserted this code below provided by Jane thank you Jane but I get no response when I input into the fields I get no response nothing calculates does this look right to you guys or what I'm doing wrong here .Thanks in advance.
{literal}<script>

var mon1 = document.editform.value_MON1;

var mon2 = document.editform.value_MON2;

x.onchange = x.onkeyup = y.onchange = y.onkeyup = function()

{

document.editform.value_MTOT.value = mon1.toFixed() + mon2.toFixed();

}
</script>
</script>{/literal}
Regards,

racerx
J
 		Jane 4/13/2009

Hi,
this code wo'nt work because you haveno't define mon1 and mon2 in your function:

<script>

var x = document.forms.editform.value_MON1;

var y = document.forms.editform.value_MON2;

x.onchange = x.onkeyup = y.onchange =y.onkeyup = function()

{

var mon1 = document.forms.editform.value_MON1.value;

var mon2 = document.forms.editform.value_MON2.value;

document.forms.editform.value_MTOT.value = mon1.toFixed() + mon2.toFixed();

}

</script>
R
 		racerx author 4/13/2009

Hi,

this code wo'nt work because you haveno't define mon1 and mon2 in your function:


Hello Jane
Tried the code you posted but still no joy <img src='https://asprunner.com/forums/file.php?topicimage=1&fieldname=reply&id=40083&image=1&table=forumreplies' class='bbc_emoticon' alt=':(' /> .I'm I missing something thanks for the help.
{literal}<script>

var x = document.forms.editform.value_MON1;

var y = document.forms.editform.value_MON2;

x.onchange = x.onkeyup = y.onchange = y.onkeyup = function()

{

var mon1 = document.forms.editform.value_MON1.value;

var mon2 = document.forms.editform.value_MON2.value;

document.forms.editform.value_MTOT.value = mon1.toFixed() + mon2.toFixed();

}

</script>{/literal}
Regards,

racerx
J
 		Jane 4/13/2009

It's difficult to tell you what's happening without seeing actual files.
Please publish your project on Demo Account and open a ticket at http://support.xlinesoft.com sending a URL to your pages along with instructions on reproducing this error.
R
 		racerx author 4/13/2009

It's difficult to tell you what's happening without seeing actual files.

Please publish your project on Demo Account and open a ticket at http://support.xlinesoft.com sending a URL to your pages along with instructions on reproducing this error.


Hello Jane,
I uploaded to Demo Account and opened a ticket .Thank you.
Regards,

racerx
J
 		Jane 4/14/2009

Try to use this one:

{literal}<script>

var x = document.forms.editform.value_MON1;

var y = document.forms.editform.value_MON2;

var z = document.forms.editform.value_MON3;

var a = document.forms.editform.value_MON4;

var b = document.forms.editform.value_MON5;

var c = document.forms.editform.value_MON6;
x.onchange = x.onkeyup = y.onchange = y.onkeyup = z.onchange = z.onkeyup = a.onchange = a.onkeyup = b.onchange = b.onkeyup = c.onchange = c.onkeyup = function()

{

var mon1 = document.forms.editform.value_MON1.value;

var mon2 = document.forms.editform.value_MON2.value;

var mon3 = document.forms.editform.value_MON3.value;

var mon4 = document.forms.editform.value_MON4.value;

var mon5 = document.forms.editform.value_MON5.value;

var mon6 = document.forms.editform.value_MON6.value;

document.forms.editform.value_MTOT.value = Number(mon1) + Number(mon2) + Number(mon3) + Number(mon4) + Number(mon5) + Number(mon6);

}

</script>

{/literal}
R
 		racerx author 4/14/2009

Try to use this one:



Hello Jane,
Wow <img src='https://asprunner.com/forums/file.php?topicimage=1&fieldname=reply&id=40129&image=1&table=forumreplies' class='bbc_emoticon' alt=':P' /> that worked like a charm thank you! thank you !thank you! .Thanks for bearing with me with this one and the great support appreciate it this is great

thank you Jane.
Regards,

rcerx
L
 		laonian 4/14/2009

Thanks Jane for the wonderful coding. I have tried it in my test project in both Add and Edit pages and it works perfectly. But when I wanted to use it in List page with Inline Edit triggered, I could not get it work. How should I modify and where should I put it for Inline Edit page? Thanks.
J
 		Jane 4/15/2009

Hi,
unfortunately there is no easy way to calculate values on the fly on the list page (Inline edit mode).
G
 		gchable 6/17/2009

how to calculate fields in real time with Phpr 5.1?
tks
J
 		Jane 6/18/2009

Hi,
use custom JavaScript code for this purpose.

Check above samples.
G
 		gchable 6/18/2009


where should I insert the code?
<script>

var x = document.forms.editform.value_MON1;

var y = document.forms.editform.value_MON2;

x.onchange = x.onkeyup = y.onchange = y.onkeyup = function()

{

var mon1 = document.forms.editform.value_MON1.value;

var mon2 = document.forms.editform.value_MON2.value;

document.forms.editform.value_MTOT.value = mon1.toFixed() + mon2.toFixed();

}

</script>
visual editor code:

<html {$html_attrs}>

<head><title>Test</title>

<link REL="stylesheet" href="include/style.css" type="text/css">

<!--[if IE]>

<link REL="stylesheet" href="include/styleIE.css" type="text/css">

<![endif]-->

<style>

#center_block{$id} {width:500px;margin:0 auto;}

#center_block{$id} {width:400px}

#contents_block{$id} {text-align:center;}

#header_block{$id} {white-space:nowrap;height:31px;text-align:center;padding:10px}

#fields_block{$id} {width:100%}

#buttons_block{$id} {padding-bottom:5px;white-space:nowrap;text-align:center}

#required_block{$id} {text-align:left;padding:5px}

#buttons_block{$id} > * {margin:0 2px}

#message_block{$id} {text-align:center;width:100%;padding:5px}

</style>

</head>

<body>

{BEGIN body}

{$header}

<TABLE class="main_table" id="center_block{$id}" align=center cellpadding=0 cellspacing=0><tr><td>

{BEGIN flybody}

<div id="header_block{$id}" class="upeditmenu">

Test, Añadir nuevo registro

</div>

{BEGIN message_block}

<div id="message_block{$id}" class="downedit2">{$message}</div>

{END message_block}
<table cellpadding=4 cellspacing=0 border=0 id="fields_block{$id}">

{BEGIN MON1_fieldblock}

<tr><td class=editshade_b width=150 style="padding-left:15px;">MON1</td>

<td width=250 class=editshade_lb style="padding-left:10px;">

{$MON1_editcontrol}

</td></tr>

{END MON1_fieldblock}

{BEGIN MON2_fieldblock}

<tr><td class=editshade_b width=150 style="padding-left:15px;">MON2</td>

<td width=250 class=editshade_lb style="padding-left:10px;">

{$MON2_editcontrol}

</td></tr>

{END MON2_fieldblock}

{BEGIN MTOT_fieldblock}

<tr><td class=editshade_b width=150 style="padding-left:15px;">MTOT</td>

<td width=250 class=editshade_lb style="padding-left:10px;">

{$MTOT_editcontrol}

</td></tr>

{END MTOT_fieldblock}

</table>
<div class=blackshade2 id="buttons_block{$id}">

<div id="required_block{$id}"><img src="images/icon_required.gif"> - Campo de requerimiento</div>

{BEGIN save_button}

<span class=buttonborder><input class=button type=submit value="Guardar" name=submit1></span>

{END save_button}

{BEGIN reset_button}

<span class=buttonborder><input class=button type=reset value="Reiniciar" {$resetbutton_attrs}></span>

{END reset_button}

{BEGIN cancel_button}

<span class=buttonborder><input class=button type=button value="Cancelar" {$cancelonclick}></span>

{END cancel_button}

{BEGIN back_button}

<span class=buttonborder><input class=button type=button value="Volver a la lista" {$backbutton_attrs}></span>

{END back_button}

{END flybody}

</td></tr></table>

{$footer}

{END body}

</body>

</html
J
 		Jane 6/19/2009

Hi,
add your JavaScript code just after </html> tag.
G
 		gchable 6/19/2009

Tks Jane, no good:
PhpR 5.1 Build 2135 posible bug?


Demo account:
http://demo.asprunner.net/gonzalo_conta_ho...t3/test_add.php
Sergey Kornilov admin 6/19/2009

Try the following:

<script>

var x = document.forms.editform.value_MON1;

var y = document.forms.editform.value_MON2;

x.onchange = x.onkeyup = y.onchange = y.onkeyup = function()

{

var mon1 = new Number(document.forms.editform.value_MON1.value);

var mon2 = new Number(document.forms.editform.value_MON2.value);

document.forms.editform.value_MTOT.value = mon1.toFixed() + mon2.toFixed();

}

</script>
G
 		gchable 6/19/2009

that worked fine
thank you