Help with wix code form total

Ask the community
,
1

Hi, I am trying to count the number of hours in the five highlighted cells and display the total hours in the total cell. is there any code to do it please ?

1385×439 30.9 KB

2

Hi,
Which type of element holds to value ?
Roi

3

Hi Roi,
It numbers. Not sure if this answer your question.

4

Hi Wisam,

assuming those elements are inputs. Lets try to construct the solution. First I will break this into smaller steps:

  1. We need to take the values from inputs and convert them to numbers (inputs normally hold strings, but string addition doesn’t really work they way we need it to)
  2. We sum the values, convert it back to string and set it in output component
  3. Make sure #1 and #2 happens after every update to any of the inputs
  1. To get a value of a regular input component and convert it to text we would do something like:
const valueAsInt = Number($w('#input1').value)
  1. Now to sum several inputs we can just
const sum = Number($w('#input1').value) + Number($w('#input2').value)

To set the value back to an output component:

$w('#text1').text = String(sum) // If output is a text
$w('#input3').value = sum // If output is an input component
  1. And for the last step, we will put it into one function and call that function on every change of the inputs.

Resulting function should look something like this:

function updateSum() {
    const sum = Number($w('#input1').value) + Number($w('#input2').value)
    $w('#text1').text = String(sum) // If output is a text 
    $w('#input3').value = sum // If output is an input component
}

Now we need to call it when change to any input happens. For this we need to create onChange handlers on all inputs and call our function.

So, the onChange event handlers will look something like this:

export function input1_change(event, $w) {
	updateSum() 
}

I hope this helps. You can read more about writing custom handlers here:

And some API documentation about TextInput can be found here. Checkout left side bar for documentation of other Wix components:

I hope this helps. Have fun Wix Coding!

P.S. Bellow is an illustration on where to generate the onChange handler, in case you need it.

498×954 61.3 KB

5

Its working, thank you so much…