Is anyone aware or any way within Wappler without manual .js to only allow certain keystrokes on an input field. I have not seen one but maybe it is hiding.
I want to land up with a number field input on a form that will only allow the Up or Down arrows on the keyboard to work and no other input at all?
Sounds like a few lines of custom Javascript needed.
As a start i would try
capture the onkeypress() event
check for up/ down arrow (codes 38 and 40)
manually increment/decrement the form.element.value according to the keypress
return false to stop the keypress being entered into the form
Then again I am certainly not the javascript expert on this forum!
1 Like
Thanks @Hyperbytes, basically what i thought, I had already done it with some .js to get it working but was just wondering if I was adding in .js for nothing when there might have already been a Wappler implementation i was not aware of. This is what I used and have been using for the last 3 years or so.
<input name="order_set_quantity" type="number" class="form-control" onkeypress="if(event.keyCode!=38 && event.keyCode!=40) {alert('Please use the clickable UP or DOWN arrows to the right of this number field, or the UP and DOWN arrows on your keyboard to alter these values.'); return false;}" onkeydown="if(event.keyCode!=38 && event.keyCode!=40) {alert('Please use the clickable UP or DOWN arrows to the right of this number field, or the UP and DOWN arrows on your keyboard to alter these values.'); return false;}" dmx-bind:value="pr_packaging" dmx-bind:min="pr_packaging" dmx-bind:step="pr_packaging" required="">@psweb Nice Solution!, mine would have been far more long winded
Wow, somebody would have done something more long winded than me, iām flabbergasted. 
You only need the onkeydown, if prevented the keypressed is never fired. Also you would also want to allow the TAB (keycode 9) and maybe ENTER (keycode 13) for accessibility.
1 Like
Thanks so much @patrick, awesome to have feedback on something that is not even Wappler code, really, really appreciate it.