[Solved] – Backspace not working in HTML Web Resources

Issue:

When we use a HTML web resource in Dynamics 365 CRM forms or even as a separate navigation, we sometimes face issue that Backspace on Text boxes do not work.

Why this happens:

This happens because in Custom HTML web resources, we add reference to “ClientGlobalContext.js.aspx”. We need this library to gain access to the global context information such as the information specific to the client, organization or user for your Customer Engagement instance*

When we use this library, we get issues with backspaces on text boxes where Input type is not “text”. So if the HTML Input type is “number”, “search”, “tel” or anything else

Resolution:

Resolution 1: 

This can be solved by changing the Input type as “Text” for all input textboxes. Then backspace will start working.

But this may not be applicable in all scenarios, since it will remove some of the functionality that was intended. In that case, you can use Resolution #2 below.

Resolution 2:

I have been able to resolve this issue by running the following code on DOM ready:

if (window.Sys && window.Sys.UI && window.Sys.UI.DomEvent && window.Sys.UI.DomEvent.prototype) {
  window.Sys.UI.DomEvent.prototype.preventDefault  = function() { };
  window.Sys.UI.DomEvent.prototype.stopPropagation = function() { };
}

This will allow you to still use the functions that ClientGlobalContext provides, while keeping it from interfering with your key and mouse events.

Credit: Stefan Boonstra 

* ClientGlobalContext.js.aspx (Client API reference)

Happy CRMing!