I have a webresource for Dynamics CRM. The project will be uploaded to the AppSource. It consists of a .html- and a .js-file. If I try to get the elements of the .html-file with document.getElementById in the .js-file, I get the error message, that DOM-Operations are not supported.
How do I manipulate my .html-file with a .js-file?
How do I register a click-event?
I hope you can help me there.
EDIT
I just solved the first question:
To access a DOM-Element I needed to use this code:
Xrm.Page.getControl(WEBRESOURCE_NAME).getObject().contentDocument.getElementById(id);
But how do I register Events on the elements?
EDIT 2
I tried to register the events like this:
element.ondragenter = function() {...}
and like this:
element.addEventListener("change", function() {...})
Both lines get the same error:
'element.onclick = functionName' registers or unregisters handles to a document object model (DOM) event of a model-driven app. This technique is unsupported in all versions of Dynamics 365 and PowerApps and should be replaced with a supported approach for registering client-side event handlers.
EDIT 3
I found the solution for the event registration (see my own answer). Now I have the problem, that I use a FileReader in my .js-script, which uses the onloadend and onerror events. And of course crm does not let me register the events in the file because of the error above.
The solution was to register the events from .html and not from .js.
<div class="DropArea" id="DropArea" ondrop="OnDrop(event)">