The scenario is having 4 step form, and in the last step the price calculated
This is done with slideshow, and each step of the form is a slide .
each field(dropdown) has in its value, the ammount of charge for the specific service.
e.g. in the first field, the dropdown has theese 2 options:
-
in the label “YES” and in the value “100” .
-
in the label “NO” and in the value “0” .
in the above example, if the client wanted the service he would click YES , so the value would be 100 .
What i want to do is basicly add all the “YES” labels(100 values), and calculate the total cost.
My problem is that in the code i wrote, there is a problem at the final value.
Instead of mathematic addition, it does string addition…
e.g if 3 services were selected:
100100100
instead of
300
var total = 1;
Slide 1 - Project Information
export function P1toP2_onClick() {
$w('#slideshow1').changeSlide(1);
total = $w('#contentwriter').value + $w('#pages').value;
}
Slide 2 - Features
export function P2toP3_onClick() {
$w('#slideshow1').changeSlide(2);
total = total + $w('#eshop').value + $w('#hotel').value + $w('#services').value + $w('#donations').value + $w('#food').value + $w('#reservations').value + $w('#blog').value + $w('#forum').value ;
}
Slide 3 - Extras
export function P3toP4_onClick() {
$w('#slideshow1').changeSlide(3);
total = total + $w('#printing').value + $w('#seo').value + $w('#logo').value;
}
Slide 4 - Client Info
#c13 is the “Total Price” text shown in the next slide on the bottom.
export function getmyquote_onClick() {
$w('#slideshow1').changeSlide(4);
$w('#c13').text = total;
}
Slide 5 - Done
Also another problem that i encountered is this :
What i want is to display the “Select Plan”(#plan) dropdown only when the "Do you need a Marketing Consultant)(marketing) is “YES”(which YES has a value of 80).
I have the “Select Plan” hidden on load.
Code runs, without errors, but when i select YES, it does not show the Select plan.
$w.onReady(function () {
$w('#marketing').onChange(() => {
if ($w('#marketing').value === '80') {
$w('#plan').show;
} else {
$w('#plan').hide;
}
});
});