I have an input filed in SAPUI5. Whenever the screen loads, it gets focus automatically with dotted lines as shown in below Image:
Also, when I click the input field, it gets focused and the dotted line is displayed. How do I remove this dotted line / disable focus when I click on input field?
The HTML text of the input field can be seen here: https://openui5.hana.ondemand.com/entity/sap.m.Input/sample/sap.m.sample.InputStates
Don't. The focus ring ("dotted line") is there for accessibility reasons and critical to keyboard users.
Regarding input fields: displaying the focus ring there is consistent with how most browsers natively behave. Regardless of the user's input modality (keyboard or mouse), the focus ring is always displayed. Besides improving the UX consistency, it also helps users to find the current input target quickly.
Having said that, I still believe that the current focus indication heuristic in UI5 should be revised, especially since the introduction of the :focus-visible pseudo class which is supported by all modern browsers. None of the accessibility standards I'm aware of dictates that the focus ring should be displayed for all elements and all the time regardless of the input modality.
Instead of trying to remove the focus ring completely, consider voting for https://github.com/SAP/openui5/issues/1289 (Give a , comment, etc).
