Increment Value with Button Click

Front End Components General
,
1

I have a number input field. I also have a button. When the button is clicked, I want the input field to go up by 1. So now it is 0. If I hit the button 3 times, then the value should show 3.

On the button, I put a dynamic event -> Mouse -> OnClick.
So it says: dmx-on:click=“form1.input1.setValue(+ 1)”

This works the first time, but not after that. It stays 1.

If I try form1.input1.setValue(input1.value + 1) it concatenates the 1s.
form1.input1.setValue(input1.value.toNumber() + 1) just sets it to 1 when you click but doesn’t go any higher.

Any ideas on what my blind brain isn’t realizing here?

2

Have you tried the ++ operator for increment instead or – for decrement

3

I had tried it, but my syntax might have been off. I tried it about 3 different ways though.

4

I think this should work:
dmx-on:click="form.input1.setValue(input1.value.toNumber() + 1)"

(which may be what you’ve tried, but it seems to work)

1 Like
5

Stupid question, but why not use the HTML5 number input for this like in
<input type="number" name="quantity" min="1" max="5">

Edit: Just to make sure, the stupid question is mine, not yours. :blush:

1 Like
6

Because this is prettier. :stuck_out_tongue: Actually, because this platform will be used most often on tablets and smartphones. With that in mind, this type of change would be more efficient while in the field. I am keeping it stupid simple for the user, and allowing them to change quantity by either method. Plus, it the additional method of the buttons is non-obtrusive.

image
image.png2262×1552 182 KB

7

I had tried that and for some reason it doesn't work. :frowning:

8

I can’t think why it wouldn’t work. Here’s a demo.

2 Likes
9

Likewise, same code although i’m not sure if there was an issue surrounding the stage of adding the 1, make sure you select number and not text as initially i had problems and this seemed to be related.

image
image.png653×694 28.4 KB

Test page: http://training.findmystudentdigs.co.uk/demo.php

(Edit cant reproduce the problem i had i thought was with the +1 stage so maybe not related after all)

1 Like
10

@TomD @Hyperbytes, I got it to work. For some reason, it was taking out everything I was doing and just putting form1.input1.setValue(+1) instead of what I was putting. I have had that happen a couple other times. I wish I could find what makes it overwrite what I put in and what doesn’t. Thanks!

1 Like
11

Its when you make the change and then excitedly push cmd+s without clicking out of the field to make it actually take or hitting tab or enter.
I have done it a few times too expecting that somehow Wappler is so smart that it just knows I have finished typing my expression and on save it must enter the alteration as well as save the document.

1 Like
12

I think that is probably true. I tend to click ctrl+s excitedly quite often. Much to my chagrin.