Print Page | Close Window

Calculation script

Printed From: openElement Website
Category:

openElement


Forum Name: Scripts for Your Website
Forum Description: Samples of scripts you can insert on your website using the element 'block of code.'
URL: https://forums.openelement.uk/en/forum_posts.asp?TID=1770
Printed Date: Mar 29 2024 at 10:23am
Software Version: Web Wiz Forums 12.04 - http://www.webwizforums.com


Topic: Calculation script
Posted By: sevens
Subject: Calculation script
Date Posted: Nov 25 2020 at 8:43pm
Hi, need help with a calculation on a page, no scripting knowledge or where and how to place such script in OE.

I have 4 elements on a page as follows:
dropdown list with id: combo_primer
text input field with id: edit_primer_width
text input field with id: edit_primer_height
text input field with id: edit_primer_qty_calc

I want to calculate as follows when a key is pressed in any one of the text input fields, or an item is selected in the dropdown list:

if combo_primer items 1 is selected then
edit_primer_qty_calc.value = roundup (edit_primer_width.value * edit_primer_height.value) / 3.6

if anyone can assist in detail, thank you





-------------
Riaan S



Replies:
Posted By: Hobby001
Date Posted: Nov 25 2020 at 8:59pm
Hi,

Can you post a link to your page?

-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: Hobby001
Date Posted: Nov 25 2020 at 9:03pm
What do you want to do with the calculated result?  Display it on the page?

Ok, I saw it in yout text input field list


-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: sevens
Date Posted: Nov 25 2020 at 9:22pm
Hi Hobby001,

The url to the page:

http://nomax.group/Paint%20Calculator.htm

Thanks, Riaan


-------------
Riaan S


Posted By: sevens
Date Posted: Nov 25 2020 at 9:27pm
Yes,

Want to display the calculated result in the text input field with id: edit_primer_qty_calc, to the far right

I see it is currently -4 in Quebec, isshhh. Would love to be able to immigrate to Canada.

Thanks,

Riaan


-------------
Riaan S


Posted By: Hobby001
Date Posted: Nov 25 2020 at 9:32pm
I will come back to you as soon as I have a minute.  It should be today or tomorow.

Meanwhile may I suggest that you take a look at these tutorials:

https://forum.openelement.com/en/forum_posts.asp?TID=1714&title=tutorial-responsive-or-not" rel="nofollow - https://forum.openelement.com/en/forum_posts.asp?TID=1714&title=tutorial-responsive-or-not

https://forum.openelement.com/en/forum_posts.asp?TID=1715&title=tutorial-position-relative-versus-absolute" rel="nofollow - https://forum.openelement.com/en/forum_posts.asp?TID=1715&title=tutorial-position-relative-versus-absolute

https://forum.openelement.com/en/forum_posts.asp?TID=1756&title=tutorial-create-your-own-responsive-menu" rel="nofollow - https://forum.openelement.com/en/forum_posts.asp?TID=1756&title=tutorial-create-your-own-responsive-menu

https://forum.openelement.com/en/forum_posts.asp?TID=1678&title=video-tutorial-oe-157-r9" rel="nofollow - https://forum.openelement.com/en/forum_posts.asp?TID=1678&title=video-tutorial-oe-157-r9


-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: Hobby001
Date Posted: Nov 25 2020 at 10:28pm
Ok, here is the code:

$('#WEcombo_primer select').change(
function(){
var $area = 0;
if($(this).val()=="Bonding Plaster Primer"){
$area = $('#WEedit_primer_width input').val() * $('#WEedit_primer_height input').val();
if ($area>0){
$('#WEedit_primer_qty_calc input').val(Math.ceil($area / 3.6));
}
}
}
);


If width or hight = 0, nothing will happend since there is no sense dividing 0 by 3.6





-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: Hobby001
Date Posted: Nov 25 2020 at 10:32pm
You have to add a javascript code block in EndBody position to your page and insert this code into it




-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: sevens
Date Posted: Nov 26 2020 at 6:05am
Thank you so much for your help, works 100%, appreciated. 

How do I trigger the same calculation for any key press in the edit_primer_width & edit_primer_height edit boxes?


-------------
Riaan S


Posted By: Hobby001
Date Posted: Nov 26 2020 at 7:58am
First add a custom class named Chosen_Fields to your two size input fields

then replace the javascript code this way:


// Action calculation on drop list change
$('#WEcombo_primer select').change(
function(){
calculate_quantity();
}
);

// Action calculation after each key up in selected input fields
$('.Chosen_Fields input').keyup(
function(){
calculate_quantity();
}
);

// update calculated field
function calculate_quantity(){
var $area = 0;
// if drop list selection is ok
if($('#WEcombo_primer select').val()=="Bonding Plaster Primer"){
$area = $('#WEedit_primer_width input').val() * $('#WEedit_primer_height input').val();
if ($area>0){
$('#WEedit_primer_qty_calc input').val(Math.ceil($area / 3.6));
}
} else {
$('#WEedit_primer_qty_calc input').val("");
}
}



You may also check the read-only check box for your WEedit_primer_qty_calc field




-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: Hobby001
Date Posted: Nov 26 2020 at 8:09am
If you plan to use different factors depending on the drop list selection, there are other changes to do

-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: Hobby001
Date Posted: Nov 26 2020 at 9:01am
Just in case my assumption is good

Change the value of each selection in the drop list

Click to select => 0
Bonding Plaster Primer => 3.6
etc

Then use the following code:

$('#WEcombo_primer select').change(
function(){
calculate_quantity();
}
);

$('.Chosen_Fields input').keyup(
function(){
calculate_quantity();
}
);

function calculate_quantity(){
var $area = $('#WEedit_primer_width input').val() * $('#WEedit_primer_height input').val();
if (($area>0)&&($('#WEcombo_primer select').val()>0)){
$('#WEedit_primer_qty_calc input').val(Math.ceil($area / $('#WEcombo_primer select').val()));
} else {
$('#WEedit_primer_qty_calc input').val("");
}
}




-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: sevens
Date Posted: Nov 26 2020 at 9:14am
Invaluable assistance, thank you very much. I would have been totally lost in the dark. 

Off the calculation script topic, I cannot seem to get the dropdown list element to have the same height as the text input fields height, it thus looks a bit odd on the page.

The next headache would be to be able to save the selected & entered values by date and time to a database that can be navigated, and as it is navigated, re calculated...


-------------
Riaan S


Posted By: sevens
Date Posted: Nov 26 2020 at 9:23am
Yes, your assumption is spot on, the "paint spreadrate" differ by paint type and substrate, and needs to be calculated differently for each type, as it is selected.

Too make it fancier, the calculated total could be split into quantities of 20L, 5L & 1L buckets. For example if the total is 126L, paint buckets would be 6 x 20L + 1 x 5L + 1 x 1L.


-------------
Riaan S


Posted By: Hobby001
Date Posted: Nov 26 2020 at 9:25am


https://zupimages.net/viewer.php?id=20/48/edg1.jpg" rel="nofollow">


-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: Hobby001
Date Posted: Nov 26 2020 at 9:27am
On the database side you need good knowledge of php and sql

Do you have the required skills?


-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: Hobby001
Date Posted: Nov 26 2020 at 9:30am
You can also save the data to a text file that you can download and rework using excel or access

-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video


Posted By: sevens
Date Posted: Nov 26 2020 at 9:46am
I have done a few sql queries many years ago, using delphi with a firebird database. Mostly just linking invisible & visible components in delphi to the db & writing a few queries to extrct view and sort data.

-------------
Riaan S


Posted By: Hobby001
Date Posted: Nov 26 2020 at 10:37am
If you want do do it on your WEB site 

You need to know 

what's available on your hosting service MySql or MySQLi.
how to handle database connections to your page
how to secure your data
how to write php code
how to write sql queries and display them on a web page
and maybe more than that

Otherwise you will need to contract it out.

As an alternate solution, using php, you can save your data on a text file on your host and download it when required to rework it with whatever tool you know.


-------------
https://denislafrance.net/index.en.php" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7WE2oJe9pX8_3u0FerqJwjo" rel="nofollow - , OE training video



Print Page | Close Window

Forum Software by Web Wiz Forums® version 12.04 - http://www.webwizforums.com
Copyright ©2001-2021 Web Wiz Ltd. - https://www.webwiz.net