Can't insert coded field into collection

Hi!

I hope someone can figure this out because, after almost 4 hours, I can’t seem to find a solution…
I have a series of other fields that I add together, and then have the result stored in another input field.
It is all numbers.
When I submit, all of the other input fields are added to the database without problem, but the field that I populate with the result of the other fields added together just shows up empty.

I have tried adding the field as text, but that doesn’t help.
I have tried adding a simple number or string to the field (with code) but it still shows up empty in the collection.
If I add text or a number manually into the input field, it shows up in the collection just fine.
I’ve tried using parseFloat, parseInt, .toString, Number, etc… nothing works.

Here’s the code I use:
function sumRevenueAmount (){
var total

total = ( 
    Number($w('#inputRevenueItem1Amount').value)+ 
    Number($w('#inputRevenueItem2Amount').value)+ 
    Number($w('#inputRevenueItem3Amount').value)+ 
    Number($w('#inputRevenueItem4Amount').value)+ 
    Number($w('#inputRevenueItem5Amount').value)+ 

    Number($w('#inputRevenueItemAAmount').value)+ 
    Number($w('#inputRevenueItemBAmount').value)+ 
    Number($w('#inputRevenueItemCAmount').value)+ 
    Number($w('#inputRevenueItemDAmount').value)+ 
    Number($w('#inputRevenueItemEAmount').value)+ 
    Number($w('#inputRevenueItemFAmount').value)+ 
    Number($w('#inputRevenueItemGAmount').value)+ 
    Number($w('#inputRevenueItemHAmount').value)+ 
    Number($w('#inputRevenueItemIAmount').value) 
); 
$w('#inputRevenueItemTotalAmount').value = total; 

}

As I said, all of the other fields above, are added to the collection just fine.
It’s a mystery!!

I highly appreciate any suggestions.

Anders

Oh and the collection field, I have tried having the type as a number and as text, it doesn’t make difference. For the other fields, they are set as numbers.

Where is your code that adds up all values for the total?


User Input:

  • Quantity For Product 1: #quantity1

  • Quantity For Product 2: #quantity2
    ​​
    Text Elements:

  • Unit Price For Product 1: #UnitPrice1

  • Unit Price For Product 2: #UnitPrice2

  • Final Price For Product 1: #FinalPrice1

  • Final Price For Product 2: #FinalPrice2

  • Total Price: #TotalPrice

 export function quantity1_change(event, $w) {
   let price = Number($w('#UnitPrice1').text);
   let selectedQuantity = Number(event.target.value);
    $w('#FinalPrice1').text = String(selectedQuantity * price);
        $w('#TotalPrice').text = String(Number($w('#FinalPrice1').text) + Number($w('#FinalPrice2').text));
}
export function quantity2_change(event, $w) {
   let price = Number($w('#UnitPrice2').text);
   let selectedQuantity = Number(event.target.value);
    $w('#FinalPrice2').text = String(selectedQuantity * price);
        $w('#TotalPrice').text = String(Number($w('#FinalPrice1').text) + Number($w('#FinalPrice2').text));
}


Text Element:

  • Menu Items: #titles

  • Total Price (Sum Total of All Items): #TotalPrice

    Repeater Elements:

  • Item Name: #ItemName

  • Unit Price: #UnitPrice

  • Quantity Ordered: #quantity

  • Total Price of Each Item (#UnitPrice X #quantity): #price
    ​​​
    Button Element: #CheckOut

Dataset
Create a dataset OrderForm with the same fields as your form.
​Database fields

  • Item Name: ItemName

  • Quantity Ordered: quantity

  • Unit Price of Each Item: unitprice

  • Total Price (Unit Price X quantity): price

$w.onReady(function () {
​
let count = $w("#dataset1").getTotalCount(); // No. of items in dataset //
$w("#dataset1").getItems(0, count) // Get all items //
.then((results) => {
    let sumTotal = 0; 
    let items = results.items;
    items.forEach(item => {
         sumTotal = sumTotal + Number(item.price);
    });
    $w("#total").text = "" + sumTotal;
    // Add other calculations here //
​
    }).catch((err) => {
     console.log(err);
    });
});

Hi!

It’s a function that’s called every time there’s a change to a text field.
I’m looking at your code, I guess you are successful in adding the price to a collection?

@anders
The first example doesn’t use a dataset, it takes all it’s needed values from the text boxes and user inputs on the page.

The second example has a dataset which contains the item names and unit prices for each of them, along with the quantity ordered and the total price for each.

So far I have narrowed my issue down to be something with the way I add the input fields together.
Eg. if I put $w(’ #inputRevenueItemTotalAmount ').value = 2*2, it works fine. It shows in the collection as expected when I save the dataset.
However, if I add the fields together, like this:

var total = 0
let number1 = Number($w(‘#inputRevenueItem1Amount’).value)
let number2 = Number($w(‘#inputRevenueItem2Amount’).value)
total = number1+number2
$w(’ #inputRevenueItemTotalAmount ‘).value = total
or even
$w(’ #inputRevenueItemTotalAmount ‘).value = Number($w(’#inputRevenueItem1Amount’).value)+Number($w(‘#inputRevenueItem2Amount’).value)

Nothing shows up in the collection after I save!
It is all shown on the page just fine, but it never shows up in the database.

I’m mystified

What you also have to remember is that your user inputs on your page will be of text type string.
https://support.wix.com/en/article/about-user-input-elements
With the choice of these only: Text, Password, Email, URL or Phone Number.
https://support.wix.com/en/article/adding-and-setting-up-a-text-input

Whereas you have most likely put your dataset fields that will contain your prices or whatever number values you have chosen, as the field type of number.

So there is one issue straight away, the user inputs are working in the text string whilst the dataset fields are working in the number value.

To change a number value into a text string, then you need to use toString.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/toString
https://www.w3schools.com/jsref/jsref_tostring_number.asp

To change a text string into a number value, then you need to use parseInt.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt
https://www.w3schools.com/jsref/jsref_parseint.asp

That is why, if you look at the first example, you will see that the user inputs are designated with .text and not .value and String is added to the actual calculation.

@givemeawhisky thank you so much for your help so far!
I totally get what you mean, but I still can’t get it to work!

I have changed to field type in the DB to Text, and this is the function now:
export function sumRevenueAmount (){
var total = 0

total = ( 
    Number($w('#inputRevenueItem1Amount').value)+ 
    Number($w('#inputRevenueItem2Amount').value)+ 
    Number($w('#inputRevenueItem3Amount').value)+ 
    Number($w('#inputRevenueItem4Amount').value)+ 
    Number($w('#inputRevenueItem5Amount').value)+ 

    Number($w('#inputRevenueItemAAmount').value)+ 
    Number($w('#inputRevenueItemBAmount').value)+ 
    Number($w('#inputRevenueItemCAmount').value)+ 
    Number($w('#inputRevenueItemDAmount').value)+ 
    Number($w('#inputRevenueItemEAmount').value)+ 
    Number($w('#inputRevenueItemFAmount').value)+ 
    Number($w('#inputRevenueItemGAmount').value)+ 
    Number($w('#inputRevenueItemHAmount').value)+ 
    Number($w('#inputRevenueItemIAmount').value) 
); 
$w('#inputRevenueItemTotalAmount').value = total.toString(); 

}

I got it to work, but I’m still not sure what is actually happening!

I created a hook on BeforeInsert to do the totaling of the input fields and set the total into a field in the collection.

Backend code:

export function GrantApplications_beforeInsert(item, context) {
 //TODO: write your code here...
 var rev1 = Number(item.revenueItem1Amount);
 var rev2 = Number(item.revenueItem2Amount);
 var rev3 = Number(item.revenueItem3Amount);
 var rev4 = Number(item.revenueItem4Amount);
 var rev5 = Number(item.revenueItem5Amount);
 var revA = Number(item.revenueItemAAmount);
 var revB = Number(item.revenueItemBAmount);
 var revC = Number(item.revenueItemCAmount);
 var revD = Number(item.revenueItemDAmount);
 var revE = Number(item.revenueItemEAmount);
 var revF = Number(item.revenueItemFAmount);
 var revG = Number(item.revenueItemGAmount);
 var revH = Number(item.revenueItemHAmount);
 var revI = Number(item.revenueItemIAmount);


var revTotal = parseFloat(rev1+rev2+rev3+rev4+rev5+revA+revB+revC+revD+revE+revF+revG+revH+revI);

    item.revenueItemTotal = revTotal;

 return item;

}

Even addning the above to the front end didn’t solve the issue.
When the total is writting with code into $w(‘#inputRevenueItemTotalAmount’).value, it just didn’t get added to the collection field.

This is the front end code:

export function sumRevenueAmount (){ 
var total


    total = (
        Number($w('#inputRevenueItem1Amount').value.replace('', '0'))+
        Number($w('#inputRevenueItem2Amount').value.replace('', '0'))+
        Number($w('#inputRevenueItem3Amount').value.replace('', '0'))+
        Number($w('#inputRevenueItem4Amount').value.replace('', '0'))+
        Number($w('#inputRevenueItem5Amount').value.replace('', '0'))+

        Number($w('#inputRevenueItemAAmount').value.replace('', '0'))+
        Number($w('#inputRevenueItemBAmount').value.replace('', '0'))+
        Number($w('#inputRevenueItemCAmount').value.replace('', '0'))+
        Number($w('#inputRevenueItemDAmount').value.replace('', '0'))+
        Number($w('#inputRevenueItemEAmount').value.replace('', '0'))+
        Number($w('#inputRevenueItemFAmount').value.replace('', '0'))+
        Number($w('#inputRevenueItemGAmount').value.replace('', '0'))+
        Number($w('#inputRevenueItemHAmount').value.replace('', '0'))+
        Number($w('#inputRevenueItemIAmount').value.replace('', '0'))
    )


    $w('#inputRevenueItemTotalAmount').value = total;
}

Pheeww. this has only taking me like 12 hours to get to work!!

You just needed to put your #inputRevenueItemTotalAmount text box on your page as .text as it is the input in that box is of text type string.

//From this....
$w('#inputRevenueItemTotalAmount').value...
//To this....
$w('#inputRevenueItemTotalAmount').text... 

Then this line of code probably would have worked as you are inputting a number value using toString which will convert it to a text type string, of which your text box on the page uses and not number value.

$w('#inputRevenueItemTotalAmount').text = total.toString(); 

@givemeawhisky #inputRevenueItemTotalAmount is an user input field, it doesn’t have .text. So that’s not possible.