How to use external js file for common functions

Forums Dynamic Forms for SharePoint How to use external js file for common functions

This topic contains 4 replies, has 3 voices, and was last updated by  Alexander Bautz 5 days, 19 hours ago.

  • Author
    Posts
  • #18629

    Ivan Wilson
    Participant

    I have a number of functions I need to reuse across different forms. I have created a separate file and reference it at the top of the Custom JS page. However, DFFS throws an error when I try to call these functions, telling me that they are not defined.

    A colleague showed how I can define my functions in the global scope. This works, but I’m wondering if there is a better way to make these functions reusable across forms?

  • #18665

    Keith Hudson
    Participant

    One way to make use of an external js file would be to edit the default New, Disp or Edit form on which you want the file to be available, and add a CEWP to the page that references the external js file. It will then be available to DFFS.

    Hopefully we will hear from Alex, as I there used to be a DFFS way to refer to external js files but I haven’t needed to use that capability recently so I don’t remember exactly how it worked or whether it still works the same in recent versions.

  • #18687

    Alexander Bautz
    Keymaster

    Hi,
    The recommended method would be to use the textarea at the top of the page in custom js. This would require that you put the link in all the forms. Alternatively you can edit the “DFFS_loader.html” file and put a reference to your custom file here to ensure it loads in all forms.

    Regarding the loading problems you had when you tried to load the file: It may be an issue with how you have wrapped the functions in this file – the functions must be available in the global scope and not inside a function. Also, you may have the wrong path to the file?

    Do you see any error messages in the console (hit F12 > Console)?

    Alexander

  • #18730

    Ivan Wilson
    Participant

    I’m using the textarea at the top of the custom js page to reference my file. However, I have to declare the functions in the external JS file using:

    window.myFunctionName = function(myParams) {}

    This adds them to the global scope. Is this the approach you’d recommend? It’s working fine, so just wondering if there is a better way.

  • #18750

    Alexander Bautz
    Keymaster

    This is correct, but you may want to ensure your function names are unique and doesn’t interfere with other built in SP functions.

    You may want to use a name-space to ensure uniqueness – something like this:

    // Define name-space
    var wilson = wilson || {};
    // Define a function
    wilson.firstFunc = function(){
       // your code
    };
    // Define another function
    wilson.anotherFunc = function(){
       // your code
    };

    Call this function like this:

    wilson.firstFunc();

    Alexander

You must be logged in to reply to this topic.