Thursday 12 February 2015

Bind saving of an IFrame to the main Save event of a CRM Form

Hello everyone. I have been struggling with this problem for quite some time now. What I needed to do was inject an Iframe on a CRM Dynamics entity form (for example the Account form) and then save things inside the iframe by calling save or autosave on the account form. Here is a way to do this.

Diagram

1. Prerequisite: The Entity must have a field named cst_dirtyenabler. Place the field on the form in its own section (in my case the Tab is called IndustryTab and the section DirtyEnablerSection) and make it invisible and disabled. Then use javascript bound to the form events:

2. on Load (of the CRM Form):

1 onLoad () {
2 Xrm.Page.getAttribute('cst_dirtyenabler').setSubmitMode('always');
3 }

3. on the Iframe javascript file:
              - set global variable isSaved: boolean = true
              - in the Save() method: last line of code must be isSaved = true;
              - implement the setFormDirty() method and remember set the dirtyenabler to enabled so that the changes can be saved.


1 function setFormDirty() {
2 if (isSaved) {
3 var Parent = window.parent;
4 Parent.Xrm.Page.getControl('cst_dirtyenabler').setDisabled(false);
5 Parent.Xrm.Page.getAttribute('cst_dirtyenabler').setValue(
6 !Parent.Xrm.Page.getAttribute('cst_dirtyenabler').getValue()
7 );
8 }
9 }

              - Call the setFormDirty() method in the Iframe javascript when you need to inform the CRM Form that a change needs to be saved. This triggers a change in the main form, making it dirty.


1 if (Window.parent.Xrm.Page.data) {
2 setFormDirty();
3 }
4 isSaved = false; // makes sure setFormDirty works only once before every save

4. bind the onSave event on the main form and trigger the Save() of the Iframe.


1 function onSave() {
2 $('iframe#WebResource_IndustryProductsForAccount').contents()
3 .find('#updateBtn').trigger('click'); // makes triggers Save() method
4 Xrm.Page.getControl('cst_dirtyenabler').setDisabled(true);
5 Xrm.Page.ui.tabs.get('IndustryTab').sections.get('DirtyEnablerSection')
6 .setVisible(false); // disable and hide the dirtyenabler again
7 }

No comments:

Post a Comment