Dynamics 365 Web Resources (JavaScript)

Objective

Web Resources in Dynamics CRM are virtual web files stored in the CRM database that enable web page functionalities within the CRM system. Various types of web resources can be used, such as HTML (Webpage), CSS (Stylesheet), JScript (Script), XML (Data), PNG/JPG/GIF/ICO (Image), XAP (Silverlight), and XSL (Stylesheet).

Although Dynamics CRM offers a wide range of built-in features, there are often scenarios where you need to extend its functionalities to meet specific business requirements. There are two main approaches to extending the functionalities of Dynamics CRM:

Client-Side Extensions – Achieved through the use of Web Resources and Form Scripting.
Server-Side Extensions – Accomplished by utilizing Plugins, Workflows, and Web Services (which will be discussed in later sections).

When extending CRM on the client side, Web Resources play a vital role. Each Web Resource is assigned a unique URL and can either be uploaded as a file or directly edited within CRM. Since Web Resources are integrated into the CRM system, they can easily be migrated across environments along with other CRM customizations.

 

Introduction

In Dynamics 365, Web Resources are essential components that allow you to extend and customize the functionality of your CRM system. They act as virtual files stored within the CRM database, enabling the integration of various types of content, such as HTML, JavaScript, CSS, XML, and images. These resources help enhance the user experience by allowing custom interfaces, client-side logic, and design elements to be added directly to CRM forms and dashboards.

By incorporating Web Resources, you can create dynamic, interactive features that align with your organization’s specific needs. These resources are easy to manage, edit, and migrate across environments, making them a flexible solution for customizing the user interface and implementing client-side customizations within Dynamics 365.

 

Adding JScript Web Resources for Any Entity

To add a JScript web resource in Dynamics 365 using Power Apps, follow these steps:

Step 1: Open Power Apps and Choose the Environment

1. Navigate to the Power Apps portal: Power Apps.
2. Sign in with your Microsoft account.

In the top-right corner, select the appropriate environment where you want to add the JScript web resource as shown below.

Step 2: Navigate to Solutions

1. In the left-hand navigation pane, click on Solutions.
2. You can choose to use a solution that already exists or create a new solution:

• To create a new solution, click New Solution.
• Enter the necessary details like the Display Name, Name, Publisher, and Version, and click Save.

Step 3: Add a New Web Resource

1. Once inside the solution, click on New in the toolbar, and from the dropdown, select Web Resource.

2. In the Web Resource creation form, fill in the following fields:

• Name: Enter a unique name for the JScript file, e.g., new_myScript.js.
• Display Name: Provide a user-friendly name, e.g., My Custom Script.
• Type: Choose Script (JScript) from the list of options available in the dropdown menu.
• Description: Optionally, add a description for the script to clarify its purpose.

 

Step 4: Upload the JScript File

1. Upload File: Click the Browse button to upload the JScript file from your local machine, or you can write the code directly in the Text Editor field if you haven't created a file yet.
2. If writing code directly, click Text Editor and enter the necessary JavaScript code.
3. After the code is entered or the file is uploaded, click Save.

Step 5: Publish the Web Resource

1. Once the web resource is saved, click Publish All Customizations in the toolbar to make the JScript web resource available for use in your Dynamics 365 environment.

Step 6: Associate the JScript Web Resource with a Form

1. To use the JScript in a form, navigate to Tables (previously called Entities).
2. Select the entity where you want to add the script (e.g., Account, Contact, etc.).
3. Click on Forms and open the form where you want to include the JScript.
4. In the form editor, click Form Properties in the toolbar.
5. Under Form Libraries, click Add and select the newly added JScript Web Resource.
6. If required, define any Event Handlers (like OnLoad or OnSave):
7. Under Event Handlers, click Add.
8. Select the Control and the Event (e.g., OnLoad, OnChange).
9. Choose the corresponding Function from the JScript file.
10. Click OK.

Step 7: Save and Publish the Form

1. Once you've added the script to the form, click Save and then Publish the form.
2. Test the functionality by navigating to the respective entity and observing the behavior triggered by your JScript code.

 

How to use the added Web Resource?

After adding a JScript web resource in Dynamics 365 using Power Apps, you can associate it with a form and use it to implement custom client-side functionality. Here's how to use the added JScript web resource:

Step 1: Navigate to the Desired Entity

1. In Power Apps (Power Apps), go to Tables (formerly known as Entities).

2. Select the entity where you want to use the JScript (e.g., Account, Contact, etc.).

 

Step 2: Open the Form Editor

1. Under the selected entity, click on Forms.

2. Select the entity where you want to use the JScript (e.g., Account, Contact, etc.).

 

Step 2: Open the Form Editor

1. Under the selected entity, click on Forms.

Step 4: Add the JScript Web Resource

1. In the Form Libraries section, click Add to include the JScript web resource.

2. A list of web resources will appear. Select the JScript web resource you added earlier, then click OK.

3. The JScript web resource is now associated with the form.

Step 5: Define Event Handlers for Specific Form Events

1. In the Events section, choose the event where the JScript should be executed:
   • OnLoad: Executes the script when the form loads.
   • OnSave: Executes the script when the form is saved.
   • OnChange: Executes the script when a specific field’s value is changed.
2. After selecting the event, click Add to associate the function in your JScript with the event.

Step 6: Configure the Event Handler

1. In the Event Handler Properties window:
   • Select the Control where the script should apply.
   • In the Library field, the JScript web resource you added should appear.
   • Under Function, type the name of the function defined in the JScript web resource that should be executed for this event.
   • If the function requires parameters, check the box for Pass execution context as first parameter or manually define parameters as needed.
2. Click OK to save the event handler.

Step 7: Save and Publish

1. After adding the JScript and setting up the event handlers, click Save in the form editor.
2. Click Publish to make the changes live.

Step 8: Test the JScript Functionality

1. Navigate to the entity and open a record to test the form where the JScript is applied.
2. Verify that the script is executed as expected for the chosen events (e.g., OnLoad, OnSave, OnChange).

 

Conclusion

Integrating JScript web resources into Dynamics 365 offers significant opportunities for customization and enhanced user experience. By leveraging client-side scripting, organizations can implement dynamic functionalities, improve data validation, and create a more intuitive interface tailored to their specific business needs. However, as beneficial as JScript can be, it is essential to navigate the associated challenges carefully.

From browser compatibility issues and performance concerns to security risks and debugging difficulties, developers must adopt best practices to ensure the reliability and effectiveness of their scripts. This includes thorough testing across different environments, optimizing code for performance, and maintaining clear documentation to facilitate future updates and collaboration.

Ultimately, with a strategic approach to implementation and ongoing management, JScript can be a powerful tool in the Dynamics 365 ecosystem. By addressing challenges proactively and prioritizing user training, organizations can fully harness the potential of JScript to create a seamless, engaging, and efficient CRM experience that drives productivity and meets evolving business requirements.

At Blueflame Labs, we specialize in leveraging the power of Web Resources to deliver innovative and effective CRM solutions. Contact us today to discuss your specific needs and explore how our Dynamics 365 expertise can benefit your organization.