1. Due to the recent site upgrade, the iPadForums (iPF) App will no longer work. The new iPadForums.net website has been designed from the ground up to work perfectly from any mobile, tablet, or desktop computer using the built in internet browser. Create a shortcut to iPadForums.net on your home screen by following these steps: Create an icon for iPadForums.net

how does the ipad handle keystroke events at the document level

Discussion in 'iPad General Discussions' started by lewis.ayers, Jun 10, 2010.

  1. lewis.ayers
    Offline

    lewis.ayers iPF Noob

    Joined:
    Jun 10, 2010
    Messages:
    3
    Thanks Received:
    0
    Trophy Points:
    0
    Ratings:
    +0 / 0
    I am working on a web application for my company that uses an iPad and a bluetooth barcode scanner as portable input devices. At first, I used an input field to capture the scanners output and submit the form. The problem is, once the screen reloads, there is no way to get the input field to get focus. This results in the user having to tap the field before each scan or the input is ignored. I have tried several methods of focusing on the field when the page loads, but it seems that the javascript 'focus()' method simply will not work without user input such as tapping a button.

    So that was a dead end...then I tried to tie an event listener to the document object with document.addEventListener('keydown', doit, false) (which works just fine on the full version of safari). Again, the ipad ignores the input until I tap on a form field. Any Ideas?
  2. mrgad
    Offline

    mrgad iPF Noob

    Joined:
    Jul 2, 2010
    Messages:
    1
    Thanks Received:
    0
    Trophy Points:
    0
    Location:
    L.A.
    Ratings:
    +0 / 0
    I am having the exact same issue, and I was just about to begin playing with code to fix it.

    Which methods did you try without any luck?

    I was planning on a very simple:

    <body onload="document.formName.elements[X].focus();">

    (where X is the field # I want to begin with)

    Did you try something along these lines and it failed to work? I would have though this would be just fine.
  3. Alling
    Offline

    Alling iPF Novice

    Joined:
    Jun 30, 2010
    Messages:
    29
    Thanks Received:
    0
    Trophy Points:
    0
    Location:
    Gothenburg, Sweden
    Ratings:
    +0 / 0
    Could something like this work?

    HTML:
    Code:
    <body onload="tigerFunc()">
    
    ...
    
    <input type="text" id="monkeyForm" />
    JavaScript (external file):
    Code:
    function tigerFunc()
    {
    document.getElementById('monkeyForm').focus();
    }
    Or have you already tried that?
  4. lewis.ayers
    Offline

    lewis.ayers iPF Noob

    Joined:
    Jun 10, 2010
    Messages:
    3
    Thanks Received:
    0
    Trophy Points:
    0
    Ratings:
    +0 / 0
    Yes, I have tried that as well. It seems that triggering a focus event on a form field with page load by direct means or by execution of a function does not work. However, if you tie the same function to a touch event or button press, focus works. I have a gut feeling that apple has deliberately done this to prevent the keyboard from appearing on page load.
    I have even gone as far as trying to capture keystrokes instead of using a text field. These methods will not work until you press something on the screen to give some element focus. I tried tying event listeners to the document and window objects, alas, no luck.

    I have tested all of these methods in safari on my Mac Mini and all have worked until i load the same page on the iPad.

    As I type this, I have another idea to try. The problem, in its simplest form, is the fact that no object has focus on page load. What if we don't submit the data with a traditional form submit? It might be possible to intercept the carrage return at the end of the string and use an AJAX call send the data and supply a callback function that inserts the return data into a div. This I have done before, but the trick here is clearing the content of the text field and maintain focus for the next scan. I will give it a shot an post my results back.

  5. lewis.ayers
    Offline

    lewis.ayers iPF Noob

    Joined:
    Jun 10, 2010
    Messages:
    3
    Thanks Received:
    0
    Trophy Points:
    0
    Ratings:
    +0 / 0
    got it

    here is the solution I came up with....


    Code:
    <?php
    if(isset($_REQUEST['data']))
    {
        $output=$_REQUEST['data'];
    }
    
    ?>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>test page</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="../includes/js/jquery-1.4.2.min"></script>
        <script type="text/javascript">
            function testit(e)
            {
                var fdata=document.getElementById('data').value;
                $.post("ipadtest.php", $("#testform").serialize(), function(data){
                    $('#output').load("ipadtest.php?data="+fdata+" #output");
                });
                document.getElementById('data').value='';
                return false;
    
            }
        </script>
      </head>
      <body>
          <form name="testform" id="testform" onsubmit="return testit();">
            <input type="text" id="data" name="data" />
        </form>
          <div id="output"><?echo $output;?></div>
      </body>
    </html>
    
    This is a simple test using jquery libraries to accomplish a ajax request. because the text field never looses focus, you can scan several times without having to touch the screen. It just requires that you touch the text field when you are ready to begin scanning.
    :ipad-keyboard::D

Share This Page

Search tags for this page
do ipads remember keystrokes
,
does javascript focus work on ipad
,

handle keypress event in ipad

,
handling key events in ios
,
input carriage return mobile safari ipad scanner
,
input focus ipad zoom
,

ios safari input text go event

,
ios safari put focus in input field barcode scanner
,
ipad bluetooth barcode scanner keypress focus
,
ipad focus javascript
,
ipad focus js
,
ipad go ignores javascript validation
,
ipad input onload focus
,
ipad javascript input
,

ipad keypress event

,
ipad onkeydown
,
ipad onkeypress
,
ipad safari onblur not firing
,
javascript ipad focus input first keydown
,
onkeydown event in ipad