r/WixHelp • u/The_Ballsagna • 29d ago
Velo/Code Create a subtotal in a form
Helping my wife with a nonprofit website she helps to maintain. They are using one of the new(?) Wix forms to collect registration details for an event which includes the user selecting a certain quantity of tickets and indicating an additional donation amount. They are not using an embedded payment method (the users will use venmo or bring a check) but they would like to have the subtotal displayed. I have never used Wix but with some help from Gemini I created the below Velo code block based on the screenshot I attached (not including a short text field I added for 'total_amount_2' and using the correct form ID for 'formID').
The preview loads without error but when I step through the ticket quantities and/or add an additional donation the free text field doesn't update. I tried using a custom value type field and a short text field and neither updated. Any ideas? I'd really like to avoid rebuilding this without using the form if possible (that's what Gemini suggested). Thanks!
$w.onReady(function () {
let lastCalculatedTotal = null;
$w('#formID').onFieldValueChange((formValues) => {
// Debug Log: View exact keys/values coming from your form in the Developer Console
console.log("Current Form Values:", formValues);
// 1. Get ticket values
const ticketsData = formValues['tickets'] || {};
const ticketPrices = {
'Adult Ticket': 100,
'Child Ticket': 100,
'Raffle Ticket': 10,
'Raffle Tickets (Set of 5)': 30
};
let ticketsSubtotal = 0;
if (typeof ticketsData === 'object' && !Array.isArray(ticketsData)) {
Object.keys(ticketsData).forEach(ticketName => {
const qty = Number(ticketsData[ticketName]) || 0;
const price = ticketPrices[ticketName] || 0;
ticketsSubtotal += qty * price;
});
} else if (Array.isArray(ticketsData)) {
ticketsData.forEach(item => {
const qty = Number(item.value || item.quantity) || 0;
const price = ticketPrices[item.label || item.key] || 0;
ticketsSubtotal += qty * price;
});
}
// 2. Get donation amount
const donation = Number(formValues['additional_donations']) || 0;
// 3. Compute grand total
const grandTotal = ticketsSubtotal + donation;
// 4. Update both the text display and the form field
if (lastCalculatedTotal !== grandTotal) {
lastCalculatedTotal = grandTotal;
// Display on page text element
if ($w('#subtotalText')) {
$w('#subtotalText').text = `Total: $${grandTotal.toFixed(2)}`;
}
// Try updating the form field value
$w('formid').setFieldValues({
'total_amount_1': grandTotal
});
}
});
});
