Hello, my recent post might be helpful to you. How about fetching the value once, making partial modifications, and then setting it again, as I did in this post?
Thank you very much for your help. That indeed worked.
But now I am stuck with the next issue and that is automatically calculating a number based on a drop down. This new form doesn’t look very convenient. The old one was at least allowing to easily manage all the components. But this new one with confusing APIs not making things simpler!
Sharing some test screenshots if you can please help.
Made a simple test form where the Registration Code would come from a DB and that works based on your solution.
Then there is a payment amount. It is for a local none profit organization. They collect some money for the number of participants selected. So I have added a free payment amount. I was thinking that in the onSubmit( ) event; I can just do a simple multiplication and calculate the amount. In the old form I was doing it in the OnValueChange of every drop down. But no such event exists in the Wix Form 2 it seems.
But it is not working. The wix documentation is also fairly light.
Did it based on the below; even though it doesn’t say if I can change values at this moment or not. If not; I have no more handles to manage such user input dependent calculations.
If you can please help. Maybe it is not at all possible with the new form. I don’t know!
Does it mean that onFieldValueChange() cannot be used to handle that? It’s the one I used in the post I shared earlier. It seems useful for detecting input and triggering some process. In your case, it’s for calculating the payment amount.
I tried. But it seems to be going into an infinite loop. Probably a change of the drop down is calling change of the price and the change in price is calling it back again! I don’t know but it keep on beeping and finally the values are not getting set in the price.
I see, that would indeed lead to an infinite loop. In that case, how about adding a condition inside the function to execute the process only when the dropdown value changes?
Good point and I was thinking about that. But the question is; how to know if something changed. I will try after office. One way could be; do a calculation and see if the calculated value is different than what is in the price. If it is different; update price else not. Hopefully that would fix the issue!
Tried, but didn’t work!
$w.onReady(function () {
const fieldValues = $w("#anandutsav").getFieldValues();
fieldValues["registration_code"] = 100;
$w("#anandutsav").onFieldValueChange(() => {
let currentPrice = Number(fieldValues["amount"]);
let newPrice = Number(fieldValues["adults"]) * 25;
console.log("Old = ", currentPrice, "New = ", newPrice);
if ( newPrice != currentPrice )
fieldValues["amount"] = newPrice;
$w("#anandutsav").setFieldValues(fieldValues);
console.log($w("#anandutsav").getFieldValues());
console.log("Set New Price = ", newPrice);
});
I tried a few things on my end as well. Wouldn’t it work with a code like this? My assumption is that the dropdown (adults) contains a number, and the calculated result is output to amount.
$w.onReady(function () {
$w("#anandutsav").onFieldValueChange(() => {
let fieldValues = $w("#anandutsav").getFieldValues();
let currentPrice = Number(fieldValues["amount"]);
let newPrice = Number(fieldValues["adults"]) * 25;
if (newPrice !== currentPrice) {
fieldValues["amount"] = String(newPrice);
$w("#anandutsav").setFieldValues(fieldValues);
}
});
});
It seems the cause was something else. I believe the issue was not updating the value according to the original field type. In your code, there were places where a number was inserted into a field that should contain a string. In this fix, I applied a String() cast to newPrice to stop the infinite loop.
If you remove the String() cast, you’ll notice that an infinite loop occurs. It seems that when using onFieldValueChange(), it’s important to be aware of the field type. Did this answer help?
I think you have created that amount field as a plain text field and not a payment field. That is why the refresh is not happening.
If I do this; the refresh is not happening. That “amount_string” is a Short Answer; hence String makes sense and the scrolling doesn’t happen if I add that. But that “amount” is a custom payment. I have no clue what is the data type of that custom payment field. And nothing is documented in the wix help either. If you can add a custom payment and try you would see that the infinite loop is happening even if you set that as a string.
Datatype is a great hint. When I saw that in the String field if I don’t type cast it as string it goes to infinite loop, I wanted to check the data type of the payment field in the collection. It seems to be an array! And the value is stored in a strange way. So my expectation is that if I can pass an array in the same format it would work!
Since I wasn’t sure about the exact design of your form, I implemented it using plain text. However, it seems that the infinite loop issue is commonly caused by type differences, so I believe this could be a clue for solving the problem. Indeed, that’s quite a strange array.
Yeh and I am not able to set the array such way. Firstly I can’t even make an array like that. And if I just cast a string that looks like [[ CHF 100 ]]. The field wouldn’t get populated. But the scrolling indeed stops if I cast the field as Array. But I need that amount in Price. Else it wouldn’t make sense to do any of these!
Progressed a bit more. But it doesn’t look like that Payment field is very programming friendly! I did manage to find out the JSON format just by displaying the item in the log. And it works in the initialization.
But it doesn’t; when I set it from onChange. Even though the JSON passed is exactly the same, the screen wouldn’t refresh. Seems like there are some hidden parameters that is used internally and doesn’t even get displayed.
It is a pity, this new form was really doing very good job. But unfortunately; I seems to go back to the old form where all these work fairly well.
const fieldValues = $w("#anandutsav").getFieldValues();
fieldValues["registration_code"] = 100;
let priceArrray =
{
"productId": "86c269ba-1c4b-4030-1bab-51a905246b4c",
"price": 100,
"quantity": 4
}
fieldValues["amount"] = Array(priceArrray); // This works as expected
$w("#anandutsav").setFieldValues(fieldValues);
$w("#anandutsav").onFieldValueChange(() => {
const fieldValues = $w("#anandutsav").getFieldValues();
let currentPrice = Number(fieldValues["adults"]);
let newPrice = Number(fieldValues["adults"]) * 25;
console.log(String(fieldValues["adults"]));
console.log("Old = ", currentPrice, "New = ", newPrice);
let priceArrray =
{
"productId": "86c269ba-1c4b-4030-1bab-51a905246b4c",
"price": newPrice,
"quantity": Number(fieldValues["adults"])
}
if ( newPrice !== currentPrice )
fieldValues["amount"] = Array(priceArrray); // This doesn't even though the JSON is exactly same as the first time
fieldValues["amount_string"] = String(newPrice);
$w("#anandutsav").setFieldValues(fieldValues);
console.log($w("#anandutsav").getFieldValues());
console.log("Set New Price = ", newPrice);
});
When you check the field containing that array in your code using $w("#anandutsav").getFieldValues(), what does the data look like? Is it the same? Does it have the same kind of array?
Yes. Exactly the same. That is how I got to know about the format and set it in the initialization. But somehow when I reset the same again from onChange with another value; that change is not getting accepted!