/    Sign up×
Community /Pin to ProfileBookmark

Need help with calculator please

Copy linkTweet thisAlerts:
Jul 26.2007

Hi all,

I’m new here but have been trying to learn javascript and ran into a very difficult project (atleast at my level of knowledge)

The little bit of code I did try to work on, didn’t work and those I found on the web were to hard to configure.

What I need is a javascript that will automatically update a two uniqe total fields, tax field and a grand total field based on a quantity input (without forcing the user to ‘click a button’ or anything) while preventing them from modifying the total costs, tax total and grand total using a readonly or onfocus() function. I searched the boards and couldnt find anything that solved this.

Here is an example of what I’m trying to do:

[CODE]
<input type=”text” name=”number_of_participants”> This is the QUANTITY field and for every one participant the cost is 250 dollars.

<input type=”text” name=”participant_total_cost”> This field will automatically update with the correct value depending on the participant quantity value.

<input type=”text” name=”number_of_reservations”> This is another QUANTITY field and each reservation is 35 dollars.

<input type=”text” name=”reservation_total”> This field will automatically calculate the correct cost of all reservations.

<input type=”text” name=”tax_owed”> This field needs to be set to 6% and automatically update itself according to the totals of the participants and reservations total costs.

<input type=”text” name=”grand_total”> and of course this field will automatically update according to the participant total cost, reservation total cost and the 6% tax.
[/CODE]

As previously mentioned, I’ve tried doing this but gave up after many frustrated hours of errors and confusion.

All help would be so greatly appreciated and credit will be given.

Thanks in advance.

to post a comment
JavaScript

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@dicicco2Jul 26.2007 — [CODE]<head>
<script type="text/javascript">
function updateCosts()
{
var partNum = forms.calculatorForm.number_of_participants.value;
var resNum = forms.calculatorForm.number_of_reservations.value;
var staticPartCost = 250;
var staticResCost = 35;
var staticTax = .06;

var partTotal = forms.calculatorForm.participant_total_cost.value = partNum*staticPartCost;
var resTotal = forms.calculatorForm.reservation_total.value = resNum*staticResCost;
var taxTotal = forms.calculatorForm.tax_owed.value = (partTotal+resTotal)*.06;
var grandTotal = forms.calculatorForm.grand_total.value = partTotal + resTotal + taxTotal;
}
</script>

</head>

<body>

<form name="calculatorForm">
<input type="text" name="number_of_participants" onblur="updateCosts()"> <!--This is the QUANTITY field and for every one participant the cost is 250 dollars.-->

<input type="text" name="participant_total_cost" disabled> <!--This field will automatically update with the correct value depending on the participant quantity value.-->

<input type="text" name="number_of_reservations" onblur="updateCosts()"> <!--This is another QUANTITY field and each reservation is 35 dollars.-->

<input type="text" name="reservation_total"> <!--This field will automatically calculate the correct cost of all reservations.-->

<input type="text" name="tax_owed"> <!--This field needs to be set to 6% and automatically update itself according to the totals of the participants and reservations total costs.-->

<input type="text" name="grand_total"> <!--and of course this field will automatically update according to the participant total cost, reservation total cost and the 6% tax.-->
</body>
[/CODE]

I didn't test it, but i'm pretty sure that will work.
Copy linkTweet thisAlerts:
@dicicco2Jul 26.2007 — of i forgot to disable the other fields, u will just need to add "disabled" to your inputs you don't want people modifying.

Also, if you are relying on this information to be accurate, you should have it also process this information on your server, because someone can change the grand_total to $.01 if they want to.
Copy linkTweet thisAlerts:
@netgrubberauthorJul 26.2007 — Hi dicicco2,

I really appreciate you taking the time to help me on this.

I tried to use your code but only produced errors so I added the updateCosts() function to the actual fields that needed to be updated and changed the trigger from onblur to onChange. This removed all errors but still no data was being calculated.
Copy linkTweet thisAlerts:
@dicicco2Jul 26.2007 — [CODE]
<head>

<script type="text/javascript">
function updateCosts()
{
var partNum = document.forms.calculatorForm.number_of_participants.value;
var resNum = document.forms.calculatorForm.number_of_reservations.value;
var staticPartCost = 250;
var staticResCost = 35;
var staticTax = .06;

var partTotal = document.forms.calculatorForm.participant_total_cost.value = partNum*staticPartCost;
var resTotal = document.forms.calculatorForm.reservation_total.value = resNum*staticResCost;
var taxTotal = document.forms.calculatorForm.tax_owed.value = (partTotal+resTotal)*.06;
var grandTotal = document.forms.calculatorForm.grand_total.value = partTotal + resTotal + taxTotal;
}
</script>

</head>

<body>

<form name="calculatorForm">
<input type="text" name="number_of_participants" onblur="updateCosts()"> <!--This is the QUANTITY field and for every one participant the cost is 250 dollars.-->

<input type="text" name="participant_total_cost" disabled> <!--This field will automatically update with the correct value depending on the participant quantity value.-->

<input type="text" name="number_of_reservations" onblur="updateCosts()"> <!--This is another QUANTITY field and each reservation is 35 dollars.-->

<input type="text" name="reservation_total" disabled> <!--This field will automatically calculate the correct cost of all reservations.-->

<input type="text" name="tax_owed" disabled> <!--This field needs to be set to 6% and automatically update itself according to the totals of the participants and reservations total costs.-->

<input type="text" name="grand_total" disabled> <!--and of course this field will automatically update according to the participant total cost, reservation total cost and the 6% tax.-->
</body>
[/CODE]

Just tested that, it works now. Made a dumb mistake.
Copy linkTweet thisAlerts:
@netgrubberauthorJul 30.2007 — Thank you...it works like a charm :0

As stated, all credits will be given.
×

Success!

Help @netgrubber spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...