Displaying results generated by user input.

Ask the community
,
1

I think I got the syntax somewhat correct because no error message is set in preview, however the result is not displayed in the textbox created for this.
The code looks like this:

import {multiply} from ‘backend/SimpleTestFunc’;

$w.onReady( function () {

});

export function button1_click(event) {
multiply($w(“#input1”).value,$w(“#input2”).value)
.then(product => {
$w(“#text1”).text = product
})
. catch (error => {
console.log(error);
});
}

With the multiply func multiplying to numbers set by the user. How can I get the result displayed in text1

Furthermore: I did some research looking into this issue and found it difficult to find anything but syntax formulas. Is there a subforum in which I can upload the above example, on the note that it works.

Thanks you

Erik
#display #userinput

2

I found this really hard as well. For example say you were calculating the area and the length and breadth were the inputs. Using properties give the text boxes names that you can then refer in code ie. txtArea, length and breadth. Then I created a button that would make the code execute.
For example name the button btnArea. Add a click even to the button. This will create a function called export function btnArea

export function btnArea_click(event) {
let Area = parseFloat($w(“#length”).value) * parseFloat($w(“#breadth”).value)*parseFloat($w(“#height”).value);
console.log("My Area is ", Area); //This is a debugging output statement to see if the code is working.
$w(‘#txtArea’).value = Area
}

This should do the trick.

3

Hi sjp4

Thank you for your reply. I must say i don’t understand the need to display the output via the backend, this surely must tamper with the overall functionality of the function looking.

I have found an error, a textbox can’t display a number (then presented as a value), and the output from my func is a number. Turning the output into a string should therefore solve the issue. However, then doing this the website, without error in the Developer Console, displays [object undefined]. The code looks as follows:

import {multiply} from ‘backend/SimpleTestFunc’;

$w.onReady( function () {

});

export function button1_click(event) {
multiply($w(“#input1”).value,$w(“#input2”).value)
.then(product => {
console.log(product)
product = toString(product)
$w(“#text1”).text = product
})
. catch (error => {
console.log(error);
});
}

Any idear why this does not work?

kind regards

Erik

4

Looking at your code I can’t see where you actually multiply the numbers. Am I right in thinking that multiply is your function. Wouldn’t it be easier to have something like this;
let product = ($w(" #input1 “).value * $w(” #input2 “).value)
$w(”#text1").value = product
console.log(product)

If this doesn’t work then try putting parseFloat in front like in my examples.

5

Yes it is the multiply func. given as such:

export function multiply(factor1, factor2) {
return factor1 * factor2
}

I have tried your parseFloat giving me the following:

export function multiply(factor1, factor2) {
let product = parseFloat(factor1 * factor2);
return product;
}

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

Therefore I tried to make the output to a string. Furthermore then using this:
$w(" #text1 “).value = product an error reveals itself as " ‘value’ does not exist on string”.

It seems we are back at the [object undefined] issue

6

Maybe try $w(parseFloat(#factor1).value) * $w(parseFloat(#factor2).value).

I didn’t fully realise it was a backend function. I did however watch a video tonight and it showed the multiply function in the backend and I went Oh now I get where it multiply’s.

My earlier response was a front end solution. Still getting my head around the code at the moment. The last couple of weeks have been a steep learning curve for me.

Sam