How to link JS file with modules, controls & templates in dotnetnuke?

Question

I am new to dotnetnuke, so i don't know how to link a js file with module, control of templates in dotnetnuke.

Can anyone help me please...

Answer 1

If you want to include JS files you should put them into a folder in your module (typically a JS folder)

Then in the Codebehind you can use the following syntax

ClientResourceManager.RegisterScript(Parent.Page, "~/Resources/Shared/scripts/knockout.js");
ClientResourceManager.RegisterScript(Parent.Page, "~/desktopmodules/DnnChat/scripts/moment.min.js");
ClientResourceManager.RegisterScript(Parent.Page, "~/desktopmodules/DnnChat/scripts/DnnChat.js",150);

example from: https://github.com/ChrisHammond/dnnCHAT/blob/master/View.ascx.cs

Answer 2

This is the way I do it. I built this helper function. Note: this requires DNN 6.1 and above

protected void InsertClientScripts(string scriptUrl, int priority = 100, ScriptLocation scriptLocation = ScriptLocation.Default)
{
    switch (scriptLocation)
    {
        case ScriptLocation.Header:
            ClientResourceManager.RegisterScript(this.Page, scriptUrl, priority, "DnnPageHeaderProvider");
            break;
        case ScriptLocation.BodyTop:
            ClientResourceManager.RegisterScript(this.Page, scriptUrl, priority, "DnnBodyProvider");
            break;
        default:
            ClientResourceManager.RegisterScript(this.Page, scriptUrl, priority, "DnnFormBottomProvider");
            break;
    }
}

public enum ScriptLocation
{
    Header,
    BodyTop,
    Default
}

This will allow you to leverage the built in Client Dependency Framework. You avoid inserting a script if it already exists, allows for compression, you can specify the location (header, body-top, body-bottom), and also set script priority. As you can see, the default priority is 100 (lower number means will be placed higher) and the default location for scripts is body-bottom. Good luck.