Vorbly <Code>
CODING MADE EASY WITH VORBLY
WIX TABLE SUM VALUE FROM DATABASE
Need to create summary table with sum values from a database? This tutorial will show you how to sum values and numbers from your database and input the information in a summary table using Wix Code. We will provide you with the webpage elements and sample codes required to implement this feature.
THE DEMO
Add a table to your webpage. Next, create a database for your table. Then add Wix Code to your page. When your page loads, your table will display the aggregated data (sum by month) from your database.
Add a table to your webpage. Next, create a database for your table. Then add Wix Code to your page. When your page loads, your table will display the aggregated data (sum by month) from your database.
THE ELEMENTS
The Page
Wix Table: #table1
The Database
Create a database Expenses.
Recommended fields:
-
Month ID: month
-
Expense Type ID: type
-
Expense Amount ID: amount
THE CODE
Page Code
import wixData from 'wix-data';
import {monthSort} from 'public/utils';
$w.onReady(function () {
$w("#table1").columns = [{
"id": "col1",
"dataPath": "month",
"label": "Month",
"type": "string"
},
{
"id": "col2",
"dataPath": "total",
"label": "Total Expenses",
"visible": true,
"type": "number"
}
];
wixData.query("Expenses")
.ascending("month")
.limit(1000) // include a limit if you have more than 50 items
.find()
.then((result) => {
const months = result.items.map(x => x.month)
.filter((obj, index, self) => index === self.indexOf(obj))
.sort(monthSort);
const aggregated = months.map(x => {
return {
month: x,
total: result.items.filter(obj => obj.month === x)
.map(z => z.amount)
.reduce((sum, current) => sum + current)
};
});
$w("#table1").rows = aggregated;
console.log($w("#table1").rows);
});
});
Public Code
// months.js //
const months = [ "January", "February", "March", "April",
"May", "June", "July", "August", "September", "October", "November", "December" ];
export function monthSort(a, b) {
return months.indexOf(a) - months.indexOf(b);
}
COMMENTS
I'm a paragraph. Click here to add your own text and edit me. It's easy.
Please complete all required fields.
No comments. Be the first to leave a comment.
Okay I look for a code to display the total number of items in my database
Stanford
Jul 10, 2019
1
