CODEWITHSUNDEEP
javascriptjqueryhtmlcordova
IlariM
IlariM

Reputation: 376

Detect keydown event (mobile)

I'm currently working on a mobile app using cordova. I've ran into this problem where I have coded a function to detect whenever an user has typed into a text input field and pressing the enter key.

Here's the JavaScript snippet;

<script type="text/javascript">
    $(function () {
        $("#searchForm").on("input", function (e) {
            e.preventDefault();
        });
        $("input").on("keydown", function (e) {
            if (e.keyCode === 13) { 
                var keyField = document.createElement('input');
                keyField.setAttribute('type', 'text');
                document.body.appendChild(keyField);
                setTimeout(function () {
                    keyField.focus();
                    setTimeout(function () {
                        keyField.setAttribute('style', 'display:none;');
                    }, 50);
                }, 50);
            }
        });
    });
</script>

the HTML part;

<form onsubmit="return false" id="searchForm">
    <input type="text" id="fieldOne">
    <input type="text" id="fieldTwo">
    <input type="button" value="Search" id="search" onclick="executeSearches()"/>
</form>

This code works to achieve hiding the mobile keyboard, but when the hiding function executes the view is being moved because of the keyField -variable.

Is there any other ways I could achieve this function without the view being moved or can I somehow determine where the view is being moved to?

Upvotes: 0

Views: 948

Answers (1)

Juan Pablo Del Castillo
Juan Pablo Del Castillo

Reputation: 11

you are missing "#", check jquery selectors

$("#searchForm").on("input", function (e) {
        e.preventDefault();
    });

Upvotes: 1

Related Questions