Control addin event arguments

josalmjosalm Member Posts: 7


Hi,

According documentation the arguments in events within control addin must belong to an array.

I can't understand how should this work with arguments. Here's my code:

AL:
trigger PreviewDocument(DocId: Text)
begin
    Message('Trigger PreviewDocument Invoked');
end;

AL Control Addin:
event PreviewDocument(DocId: Text);

Js
script: (this is where the button is added inside a loop) In here, i
tried without the brackets, with them and with and without question
marks.
'<div id=buttonPreview>' +
'<button onclick="previewDocumentFunction(["' + Docid + '"])">Preview</button>' +
function previewDocumentFunction(DocId) {
    Microsoft.Dynamics.NAV.InvokeExtensibilityMethod('PreviewDocument', [DocId]);
}
document.querySelector('buttonPreview').addEventListener('click', previewDocumentFunction);

After inspect the page:

2henpkdvf6z2.png

Nothing happens after the click.

Any ideas?

Best Answer

  • dreezdreez Member Posts: 73
    Answer ✓
    Hey,

    I see two potential problems with your code - but I am not sure, because your sample code is too small.

    First of all, I think there might be too many and incorrectly placed quotation marks, that might lead to syntax errors for example, here:
    <button onclick="previewDocumentFunction(["' + Docid + '"])">Preview</button>' +

    looks like the first mark inside the array is closing the mark that is right after onclick.

    Second of all

    I think you are passing an array
    ["' + Docid + '"]

    into the function
    previewDocumentFunction(DocId)

    which is putting this into another array, resulting in passing an array of arrays into the Event, and eventually it ends up with something like this:
    Microsoft.Dynamics.NAV.InvokeExtensibilityMethod('PreviewDocument', [["' + Docid + '"]]);

    which cannot be interpreted correctly by AL; thus nothing happens.

    I have made a sample button like this:
    DocId = 'XYZ';
    button.onclick = function () {
        Microsoft.Dynamics.NAV.InvokeExtensibilityMethod("ButtonClicked", [DocId]);
    };

    and it works perfectly fine.

    Here is my full javascript code:
    document.addEventListener("DOMContentLoaded", function () {
        var container = document.getElementById("controlAddIn");
    
        if (container) {
            var button = document.createElement("button");
            button.innerText = "Click Me";
            button.style.padding = "10px";
            button.style.fontSize = "16px";
            button.style.cursor = "pointer";
    
            DocId = 'XYZ';
            button.onclick = function () {
                Microsoft.Dynamics.NAV.InvokeExtensibilityMethod("ButtonClicked", [DocId]);
            };
    
            container.appendChild(button);
        }
    });

Answers

  • dreezdreez Member Posts: 73
    Answer ✓
    Hey,

    I see two potential problems with your code - but I am not sure, because your sample code is too small.

    First of all, I think there might be too many and incorrectly placed quotation marks, that might lead to syntax errors for example, here:
    <button onclick="previewDocumentFunction(["' + Docid + '"])">Preview</button>' +

    looks like the first mark inside the array is closing the mark that is right after onclick.

    Second of all

    I think you are passing an array
    ["' + Docid + '"]

    into the function
    previewDocumentFunction(DocId)

    which is putting this into another array, resulting in passing an array of arrays into the Event, and eventually it ends up with something like this:
    Microsoft.Dynamics.NAV.InvokeExtensibilityMethod('PreviewDocument', [["' + Docid + '"]]);

    which cannot be interpreted correctly by AL; thus nothing happens.

    I have made a sample button like this:
    DocId = 'XYZ';
    button.onclick = function () {
        Microsoft.Dynamics.NAV.InvokeExtensibilityMethod("ButtonClicked", [DocId]);
    };

    and it works perfectly fine.

    Here is my full javascript code:
    document.addEventListener("DOMContentLoaded", function () {
        var container = document.getElementById("controlAddIn");
    
        if (container) {
            var button = document.createElement("button");
            button.innerText = "Click Me";
            button.style.padding = "10px";
            button.style.fontSize = "16px";
            button.style.cursor = "pointer";
    
            DocId = 'XYZ';
            button.onclick = function () {
                Microsoft.Dynamics.NAV.InvokeExtensibilityMethod("ButtonClicked", [DocId]);
            };
    
            container.appendChild(button);
        }
    });
  • josalmjosalm Member Posts: 7
    dreez wrote: »
    Hey,
    Thanks, for the insight. I didn't understood the syntax at first since it's my first time using JS.

    I did this and it worked.
    '<div id=buttonPreview>' +
            '<button onclick="previewDocumentFunction(' + '\'' + Docid + '\'' + ')">Preview</button>' +
            '</div>'

    Thank you for your time. Have a great week
Sign In or Register to comment.