Really Simple Question

Discussion Ask a question
, ,
1

Hi, I’m new to Wix code. I have set up a collection which stores expenses in a column called ‘Amount’. All I want to do is display the sum of all the those expenses in the ‘Amount’ column and display the result in a text field at the top of the page (I don’t want to store the sum back into the collection).
I assume I have to create a hook to sum the data but i can’t seem to find any specific examples that would do this and I am unsure how then to display the result in a text field.
Any help woud be greatly appreciated, thanks.

1 Like
2

Hi,
Welcome to WixCode.
"Really Simple Question”? Hah!

I can’t say that I’m clear about what you’re trying to do, but I’ll throw out some ideas and see if one of them sticks to the target.

You don’t really need a hook here. You can do a query on the database, and then in the results of the query() function, you will get results.items (in the then block) which contains an array of objects, where each object is an item in collection. It’s then a simple matter to loop through the query results and sum the column (or even columns) that you need.

The loop would look something like this:

let sum = 0;
results.items.forEach((item)=> {
     sum = sum + item.price
});

You can then set your text field to the value of the variable sum.

Eazy Peazy. Right?

Have fun,

Yisrael

2 Likes
3

Hi Yisrael
I hope you will notice this,

I really need a urgent help.
Could you help me with this → https://www.wix.com/code/home/forum/questions-answers/i-need-a-help-of-a-wix-expert

Thank you!

1 Like
4

Hey Geo,

Good seeing you again. But, who said I’m a Wix Expert? :wink:

I’ll take a look, see you there.

Yisrael

1 Like
5

Thank you Yisrael. What a relief.
hahaha! Everyone here knows you are a wix expert!

6

Many thanks for the help. I’m struggling to link the two codes together - i.e. the query element to select all the data from a collection and then the sum element via the loop.

Code I have so far is …

import wixData from ‘wix-data’;
$w.onReady(function () {
wixData.query(“members”)
.find()
.then((results) => {
let firstitem = results.items[0];
});
});
The above code doesn’t error but doesn’t seem to return any data. Where would I insert the sum function as you described? Any help much appreciated!

7

As I mentioned in my previous post, you need to put the code that calculates the sum in the .then block, along with the code to set the table contents to the query results. The .then block will look something like this:

.then((results) => {
let sum = 0;
results.items.forEach((item)=> {
sum = sum + item.price
});
$w(“#sumText”).text = sum; // display sum
$w(“#table”).rows = results.items; // set contents of table to the results
});

For more options and possibilities, read about $w.Table .

Have fun,

Yisrael

8

Great, much appreciated. I have just one more question - how can I convert the sum (a number) to a string so that I can display it in a text box? I currently have the following error;

Wix code SDK error: The text parameter that is passed to the text method cannot be set to the value NaN. It must be of type string.

9

I suspect that it’s not because the sum is a number, rather NaN means (Not a Number). It appears that there is either no value or an invalid value in the sum variable. Make sure that the fields you are summing are numbers and have valid values. You can view what’s going on by adding console.log() to your code:

.then((results) => {
    let sum = 0;
    results.items.forEach((item)=> {
        console.log(item.price);    // display the price
        sum = sum + item.price;
        console.log(sum);           // display the current sum
    });
    $w("#sumText").text = sum;          // display sum
    $w("#table").rows = results.items;  // set contents of table to the results
});

Remember: console.log() is your friend. It displays information in the developers console while the code is running. It helps you figure out what’s going on with your code. Use it freely.

10

Great thank you for all your help, much appreciated. I’ll have a play!!

11

So I still get an error. I was referencing the wrong field name previously (“Amount” instead of “amount”) so I am happy the sum is working now but it is still saying i should convert it to a string as per below; Any ideas?
Loading the code for the New Page page. To debug this code, open wgrc8.js in Developer Tools.
333
333
444444
444777
50
444827
200
445027
Wix code SDK error: The text parameter that is passed to the text method cannot be set to the value 445027. It must be of type string.

12

Hmm, you might need to “convince” the code to convert your sum to a string. You can do it like this:

$w("#sumText").text = "" + sum;

This is a common technique in Javascript. The idea is that by concatenating a string - in this case, a blank string (“”) - with a numeric variable, it causes Javascript to convert the numeric variable to a string.

13

Fantastic that works. Thanks again. I’ll leave you in peace now!

14

Yay! I’m glad I was able to help. Good luck and have fun!