Extensible control, data-dyn-bind scripts

(0) Share

Report

Posted on by hca

158

I have an extensible control where I am trying to dynamically change the script URL's inside the .htm resource file. I want these scripts to be loaded into the browser before I call my local .js resource. This seems impossible as (I assume that) the HTML framework gets initialized/constructed in the .js file. The reason I want to get those resources loaded before the .js file is executed is due to some references in the .js file that need to be resolved ahead of loading it. Otherwise I am getting some timing issues and not able to load everything in time (I am not a javascript expert). Is there anyone who could point me in the right direction?

Thank you.

edit: I forgot to mention that I am able to delay execution of my .js code so the resources are loaded in time, but it seems to break the data-dyn-bind framework so the size of my component is no longer configurable. Which is then the only thing I need to configure in the .htm file.

I have the same question (0)

All responses (4)

Answers (1)

Suggested answer

WillWU 22,361 on at

Like (0)

Report

Hi partner,

What are your business requirements？ Why you can't make changes in the HTML through JS?

Was this reply helpful? Yes No
hca 158 on at

Like (0)

Report

Hi Will,

I can change the HTML in the JS, but by then it's sort of too late. The JS will refer to a namespace that needs to be resolved/loaded before the JS file. Even if the namespace is available in time, the Finance & Operations HTML framework gets broken for some reason, so I can no longer use data-dyn-bind. In this example, they mention the same issue (I think): devblog.sertanyaman.com/.../ "We could have used “data-dyn-bind=”attr: {value: $data.DefaultTime}”” on our input element to dynamically bind our control’s value to the HTML input element’s value attribute; but in our example, that does not work. The initialization of the clockpicker plugin destroys the binding done on the input element by the data-dyn-bind attribute."

I'm wondering if this is a bug in F&O?

I am able to delay execution of the code in JS that refers to the external namespace by using a dyn-data-bind to the click event for example, but that will not work for production. If I try to bind to the loaded event, it just gives me some errors.

edit: The business requirement is to integrate a widget from a document management system. The widget code is owned by someone else, and the location of said code can vary. So it's possible to set the URL in a parameter form, and it gets passed to the widget through an event on a table. It's just proving difficult to use the URL. Is there some kind of event we can use when the F&O HTML framework has finished loading for example?

Was this reply helpful? Yes No
hca 158 on at

Like (0)

Report

Based on your comment I tried something else. I had been trying to load the external resource by using JQuery which seemed to interrupt the HTML framework in F&O. Instead, I just appended the script URL to the HTML header and wait a little bit before calling the code which relies on the script being loaded. It seems to work better. I have to look at this a bit more after Easter, but I think it's a step in the right direction. Thanks!

Was this reply helpful? Yes No
Verified answer

hca 158 on at

Like (0)

Report

In case someone else comes across this thread. I had tried various ways to load the scripts, for instance

    $.ajax({
        url: URL,
        dataType: "script",
        async: false,
        success: console.log("Success!")
    });

However, this seemed to destroy the F&O HTML framework for reasons unknown.

Ended up with this code when the F&O HTML framework gets initialized, which seems to work better.

        var s = document.createElement("script");
        s.type = "text/javascript";
        s.src = $dyn.value(data.URL);
        $("head").append(s);

I do wish we had some way of knowing when the system finished loading, and we could trigger something based on that.

Was this reply helpful? Yes No

Join the conversation

Community site session details

Extensible control, data-dyn-bind scripts

Helpful resources

Quick Links

Responsible AI policies

Neeraj Kumar – Community Spotlight

Congratulations to the November Top 10 Community Leaders!

Leaderboard > Finance | Project Operations, Human Resources, AX, GP, SL

Featured topics

Product updates

Community site session details

Extensible control, data-dyn-bind scripts

Helpful resources

Quick Links

Responsible AI policies

Neeraj Kumar – Community Spotlight

Congratulations to the November Top 10 Community Leaders!

Subscribe to this forum!

Select categories

Leaderboard > Finance | Project Operations, Human Resources, AX, GP, SL

Featured topics

Product updates