Include JavaScript functions in JavaScript code

Like (0) Share

Report

Posted on 6 Aug 2024 15:11:43 by JonEvans

Hi,

I've got a Power Pages site which uses a Multistep form. In the steps in this form, I'm using JavaScript. Within this JavaScript, I've got a couple of functions that I'd like to use across a lot of the Form Steps.

I could just paste these functions into the JavaScript of each of the Form Steps that uses it but it doesn't seem like a very good use of space - it would be better to have a single version of the function stored somewhere that all the Form Steps could access.

I've tried uploading the .js file to Web Files and referencing it on the Form Steps which didn't work. I've tried including the .js file in the web template that the page uses but, again, this didn't work. I'm fairly new to Power Apps Portals so it's possible I'm doing something wrong but I'm hoping someone out there has done this before.

Thanks.

All responses (4)

Answers (0)

Suggested answer

Fubar 7,901 Super User 2025 Season 1 on 12 Aug 2024 at 22:02:26

Like (0)

Report
Include JavaScript functions in JavaScript code

When you are in the Browsers debug console (F12) can you call the function that is in the Web File from the console? If not either your not linking your Web File to the Web Page correctly (e.g. not the correct path in the script tag) or there could be an issue in the JavaScript in your Web File.

My example works, the Web File contains a simple function

function tester(){ alert("tester"); }

For further assistance you would need to provide more details of how you have setup the Web File record, how you are including the File in your Web Page/Template etc
JonEvans 7 on 08 Aug 2024 at 08:30:44

Like (0)

Report

Include JavaScript functions in JavaScript code

Hi Fubar,

Thanks for your reply. I'd already done most of this but, just to be sure, I tried again but it's still not showing.

I double-checked my code in the function by having it in the Form Step and calling it from within the $(document).ready(function () { code. When the code is in the Form Step, it works - when it's removed from the Form Step and added to the Web File, it doesn't work.

I also thought it could've been the way the functions were being declared in the file, they had been in there as var FunctionName = function (fieldName) { so I tried changing them to function FunctionName(fieldName) { but this didn't affect anything.

The one thing I've forgotten to do previously was to sync the changes - I tried this but, as with all of the above, still not working.

I also tried, on the Web File, to change the Parent Page. I'd previously got it set to the Multistep Form and tried it on the Home page as well but, as before, this didn't work.

The fallback position of having a copy on each of the Form Steps isn't the end of the world so I'll look at doing this. I think I've spent enough time trying to get this working.
Suggested answer

Fubar 7,901 Super User 2025 Season 1 on 07 Aug 2024 at 01:47:04

Like (1)

Report

Include JavaScript functions in JavaScript code

Part 3

Step

Use the Power Pages Management App to open the Step and then add JavaScript/JQuery to the Custom JavaScript field - make sure you include a document ready block (or similar if using plain JavaScript) - tester was the name of a function in the file uploaded to the Web File.

Before the changes will take affect you will need to Sync and re-preview if in the designer (or from the portal manually clear the portals cache <site url>/_services/about when logged in as a user with the Administrators Web Role assigned)
Suggested answer

Fubar 7,901 Super User 2025 Season 1 on 07 Aug 2024 at 01:17:30

Like (1)

Report

Include JavaScript functions in JavaScript code

If the Web File is setup correctly, and available to the Web Page you should be able to call a JavaScript function in the Web File from the Custom JavaScript field on the Form Option tab for the Step (available in the Power Pages Management App).

I will try to post several posts, when I have tried to post a full response it is being blocked for some reason

Web File

Make sure you popualate the Parent Page field - if you use the home page your path will be "/" if you use another page your path will be the shortname path to that web page. Also note the .js on the Partial Url.

Community site session details

Include JavaScript functions in JavaScript code

Helpful resources

News and Announcements

Quick Links

Announcing the Engage with the Community forum!

🌸 Community Spring Festival 2025 Challenge Winners! 🌸

Warren Belz – Community Spotlight

Leaderboard > Power Pages - Power Apps Portals

Featured topics

Product updates

Community site session details

Include JavaScript functions in JavaScript code

Helpful resources

News and Announcements

Quick Links

Announcing the Engage with the Community forum!

🌸 Community Spring Festival 2025 Challenge Winners! 🌸

Warren Belz – Community Spotlight

Subscribe to this forum!

Select categories

Leaderboard > Power Pages - Power Apps Portals

Featured topics

Product updates