Control addin event arguments

josalm
josalm Member Posts: 7
in NAV Three Tier


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

  • dreez
    dreez 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

  • dreez
    dreez 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);
    }
});
  • josalm
    josalm 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

Categories