How can I configure the triggers for the scanner on the Enterprise Browser dashboard?

When configuring a bookmark on ssl.scandit.com, you can specify two different types of scanner integrations:

1. Scan Button Integration
2. Input Field Element Integration (If you want to add more than one, save the page and a new integration field will be added).

Scan button integration

Enabling it will add a scan button at the bottom of your page at all times. When clicking it, the scanner will open and let you scan one barcode. The result of the scan will be entered in the field which was in focus before the button was clicked.

You can also specify additional actions in the "After Scanning" field:

• Do Nothing: The keyboard will remain open once the scanner is closed
• Close Keyboard: The keyboard will be closed once the scanner is closed
• Submit Form: The browser will look for a submit button and press it once the scanner is closed. You can specify the button to be pressed in the "Element" field next to it on the dashboard.
• Focus Next Input: The Browser will focus the Next Input in the webpage once the scanner is closed.

Input Field Element integration

This allows you to trigger the scanner automatically around some specific input fields in your page. These integrations are split into multiple parameters:

• Input Field Element: the CSS selector of the element which will trigger the scan (see below for more information on CSS selectors). For example, ".input" will select the element of the class "input" and "#id123" will select the element with the id "id123".
• Scanner start:
  • On Tap: The Scanner will launch as soon as the element specified as "Input Field Element" is tapped
  • On Page Load: The Scanner will launch as soon as the element specified as "Input Field Element" is detected in a webpage (so as soon as a page with such an element is loaded). The element will be in focus when the scanner closes.
• After Scanning: If activated, the scanner will automatically submit the form the barcode has been scanned into.
  • Do Nothing: The keyboard will remain open once the scanner is closed
  • Close Keyboard: The keyboard will be closed once the scanner is closed
  • Submit Form: The browser will look for a submit button and press it once the scanner is closed. You can specify the button to be pressed in the "Element" field next to it on the dashboard.
  • Click: The browser will click on the element specified in the "Element" field next to it on the dashboard.
  • Focus Next Input: The Browser will focus the Next Input in the webpage once the scanner is closed.

CSS selectors

CSS selectors are a standard web technology to query elements on a website. You can learn more about CSS selectors at W3Schools: CSS Selector Reference. 

To know the class/id/attribute of an element you want to target using selectors, right-click on it and then select "inspect element" (wording might vary slightly across browsers). The browser will then open the relevant element for you and give you its attributes. In the below example, after inspecting the "Next" button, the browser highlighted in blue the relevant attributes. I can see that I can use the class name "w3-right w3-btn" to identify the "Next" button, so my selector will be ".w3-right w3-btn".

Sometimes, the element you want to refer to doesn't have any unique attribute you can use as its selector. In such cases, the easiest way is to right-click the corresponding element and select "Copy > Copy selector" (again, wording might vary slightly across browsers), as you can see below: 

Thanks to that you will get a CSS selector unique for this particular element. In the above example, the CSS selector of the marked input field has the following format:

body > div.L3eUgb > div.o3j99.ikrT4e.om7nvf > form > div:nth-child(1)
  > div.A8SBwf > div.RNNXgb > div > div.a4bIc > input

It can be used as a trigger in the Enterprise Browser configuration without any issues, since it is a valid selector.