4 Replies Latest reply on May 6, 2012 5:19 PM by Darryn Campbell

    ET1: Setting focus on text box without raising the virtual keyboard

      I have a simple screen with one text box field and list display.

      The textbox filed is intended to receive scanner input from either the camera or CS3070 BT scanner.

      When I set focus to the text box field the virtual keyboard is displayed causing the user to take additional action of dismissing it to see the list of scanned items.

      Is there a way to call focus on a field and not raise the virtual keyboard?

        • Re: ET1: Setting focus on text box without raising the virtual keyboard
          Robert Galvin

          Todd,

           

          I have not tried this, but you could try and use the sip.manual() in the beforeFocus for the text box (to change it from Automatic) and then return it to automatic by sip.Automatic. Or you could also change the position of it to be 'off screen' using sip.left and sip.top

          • Re: ET1: Setting focus on text box without raising the virtual keyboard
            Benedict Kennedy

            You can disable the virtual keyboard by calling sip.manual(); for example in JavaScript:

             

            function disableKeyboard()
            {
                 sip.manual();
            }
            

             

            or in HTML:

             

            <meta http-equiv="sip" content="manual" />
            

             

            This call will disable the virtual keyboard for the entire application. In order to enable it again either:

             

            function enableKeyboard()
            {
                 sip.automatic();
            }
            

            or

             

            <meta http-equiv="sip" content="automatic" />
            

             

            would need to be called.

             

            Instead of having to select a text box to enter scan information, I would highly recommend using RhoElements decodeEvents to handle scan data. For example:

             

            <html>
                      <head>
                                <script type="text/javascript">
                                          window.onload = function()
                                          {
                                                    scanner.decodeEvent = "url('JavaScript:scanReceived(%json)')";
                                                    scanner.enable();
                                          };
              
                                          function scanReceived(scanData)
                                          {
                                                    //Do whatever you want with the scan data here
                                                    //All I am doing is displaying the data on the page
                                                    document.getElementById("data").innerHTML = scanData.data;
                                                    document.getElementById("source").innerHTML = scanData.source;
                                                    document.getElementById("type").innerHTML = scanData.type;
                                                    document.getElementById("time").innerHTML = scanData.time;
                                                    document.getElementById("length").innerHTML = scanData.length;
                                                    document.getElementById("event").innerHTML = scanData.event;
                                          }
              
                                          function quit()
                                          {
                                                    application.quit();
                                          }
                                </script>
                      </head>
                      <body>
                                <h1>Example Scan Page</h1>
                                <h2>Hold the trigger button to scan</h2>
                                <p>Data: <span id="data"></p>
                                <p>Source: <span id="source"></p>
                                <p>Type: <span id="type"></p>
                                <p>Time: <span id="time"></p>
                                <p>Length <span id="length"></p>
                                <p>Event: <span id="event"></p>
                                <button onclick="quit()">Quit</button>
                      </body>
            </html>
            

             

            In this page, scanning a barcode will automatically fill in the scan details no matter where the focus is in the page.

            A further change to improve this page could be using the scan data to automatically update the page via an AJAX call.