Finish input editing on pressing Enter

Suite and Optimus Suite 7
#1

I’m attempting to use the “onkeydown” event of an input to submit a form that is usually done via clicking a button. With the button click, the input goes out of focus so the value is captured with form.getValue(). With the “onkeydown” event the input value is returned as empty when I call form.getValue(), even if I first call form.blur(). What do I need to do to “finish” the editing in the input field when Enter is pressed?

Edit to add: I have discovered that if I put the form.events.fire(“buttonClick”,…) inside a setTimeout with a timer of 1 ms, it works as expected. That’s acceptable for my purposes in this instance, but it’s not the “clean” way to do it and may not work in all circumstances. So any help on finding the “right” way to do it is still appreciated.

#2

Please, try to use the awaitRedraw() helper instead of the seteTimeout().

Something like:

form.events.on("keydown", function (event, name, id) {
    if (event.code == "Enter") { //check the enter key press
        form.blur(); // blur out of the input/form
        dhx.awaitRedraw().then(function () { //wait for the processs rendering
            console.log(form.getValue()) //get the updated value / send the form
        })
    }
});

https://snippet.dhtmlx.com/uw701xap

1 Like
#3

Ahhh, I always forget about awaitRedraw! Thank you!