web
You’re offline. This is a read only version of the page.
close
Skip to main content

Notifications

Announcements

No record found.

Community site session details

Community site session details

Session Id :
Customer experience | Sales, Customer Insights,...
Suggested Answer

JavaScript Alert : Microsoft Dynamics CRM (Cloud)

(0) ShareShare
ReportReport
Posted on by 1,135

Hello Forum Members:

Does anybody have experience with developing custom Alerts, Microsoft Dynamics CRM (Cloud), with JavaScript? 

I know the JavaScript code to use to but don't know the easiest way to test custom page and alert.

Please help! Thanks!

I have the same question (0)
  • Community Member Profile Picture
    on at

    hey Casey,

    you can get easy around it, checking the official docs:

    Alert Dialog:
    https://docs.microsoft.com/en-us/powerapps/developer/model-driven-apps/clientapi/reference/xrm-navigation/openalertdialog

    I think that the example here explains basically everything you need to know:

    var alertStrings = { confirmButtonLabel: "Yes", text: "This is an alert.", title: "Sample title" };
    var alertOptions = { height: 120, width: 260 };
    
    Xrm.Navigation.openAlertDialog(alertStrings, alertOptions).then(
        function success(result) {
            console.log("Alert dialog closed");
        },
        function (error) {
            console.log(error.message);
        }
    );

    Or are you talking about developing some completely custom created by yourself?

    You could of course also try to work with the Alert.js libraries. These do work fine.

    What do you mean with "the easiest way to test custom page and alert"?

    Please mark this answer as verified if it helped solving your issue.
    Happy Developing.

  • Suggested answer
    Rawish Kumar Profile Picture
    13,758 on at

    Please go with the way Evgeniy suggested above.

    This is the standard supported way of showing client side alert for dynamics 365.

  • Suggested answer
    Pawar Pravin  Profile Picture
    5,237 on at

    Hi ,

    It depends on which version you are currently using for development. In case if are having dynamics 365 (latest version) then you could use latest xrm library to show alert with great look and feel.

    Please refer below url for more info:

    pravinpawarweb.wordpress.com/.../

  • CaseyB Profile Picture
    1,135 on at

    I wish to create a custom alert (using JavaScript) in Microsoft Dynamics CRM Online. I want to use a 

    *.js page to create this custom alert. I took a class on JavaScript and I want to practice coding to extend processes in Microsoft Dynamics CRM.

    How do I access the *.js library ? Can I modify an existing *.js file and test the functionality that way.

    Please help! Thanks

  • CaseyB Profile Picture
    1,135 on at

    Pravin:

    I don't know how to access the xrm library. I have Microsoft Dynamics CRM (365) Version 1710 (9.1.0.10537) online.

    Can you help?

    Thanks!

    Casey

  • Suggested answer
    Community Member Profile Picture
    on at

    Hey Casey,

    it seems as if you are on the latest version available. So you should use the latest Client-API.

    Here is the link on how to use the "openAlertDialog" from the official Microsoft documentation:

    docs.microsoft.com/.../openalertdialog

    Let me try to demonstrate it with an example in my development instance. I will explain each step as detailed as possible since I am not sure how much experience you have on customizing the system, please don't take it personal .

    1. In my example I will open the alert dialog whenever a user fills a "whole number" field with the number 1 on the account entity. That way you will also see how you can access fields on the form via the new Client-API. In order to access fields or control on a form, you will need to pass the Execution Context when registering the JS-Function onto an onChange Event of a field. Once the Execution Context is passed to the function, we can get the Form Context from it and then retrieve field values with it.

    2. On the Account Entity you can see my (whole number) field which can basically be any integer

     Integer.PNG

    1680.form.png

    3. Now we create a JavaScript file named "Alert_Example.js" and write the function that is going to open the Alert Dialog if the field contains the value/integer 1. Keep in mind that we will need Execution Context and then the Form Context from it to check the values of the field.

    //Pass "executionContext" as first parameter
    function OpenAlert(executionContext){
    
    	//Get the FormContext from the ExecutionContext
    	var formContext = executionContext.getFormContext();
    
    	//Get the Integer Field we want to check
    	var integer_field = formContext.getAttribute("evd_integerfield");
    
    	//Check whether the field contains any value at all in order to avoid an exception
    	if(integer_field.getValue() !== null){
    
    		//Check whether the field value equals 1
    		if(integer_field.getValue() == 1){
    
    			//Set the necessarry parameters for the Alert Dialog like the Label of the Confimation Button, the text and the Title of the Dialog
    			var alertStrings = { confirmButtonLabel: "Yes", text: "This is an alert.", title: "Sample title" };
    			//Set the width and height of the Dialog
    			var alertOptions = { height: 120, width: 260 };
    
    			//Call/open the dialog passing the parameters
    			Xrm.Navigation.openAlertDialog(alertStrings, alertOptions).then(
    			    function success(result) {
    			        console.log("Alert dialog closed");
    			    },
    			    function (error) {
    			        console.log(error.message);
    			    }
    			);
    		}
    	}
    }

    4. Save the file and upload it as a new WebResource, save and publish it.

    new_5F00_resource.png

    pastedimage1576445489878v2.png

    5. Go back to the Account form and add your WebResource to the form:

    pastedimage1576445592770v3.png

    pastedimage1576445661241v4.png

    pastedimage1576445729182v5.png

    Close the FormProperties by confirming via "OK".

    6. Now open the field properties of the integer field by double-clicking on it, head over to the "Events" tab and click on "Add" to add a new onChange Event:

    pastedimage1576445863950v6.png

    pastedimage1576445987911v7.png

    7. Select your WebResource/JS-Library, type the name of the function and don't forget to tick the box for passing the executionContext:

    pastedimage1576446092344v8.png

    8. Confirm the Handler via "OK" and close the Field properties via "OK. Finally "Save" and "Publish" the form.

    pastedimage1576446178344v9.png

    9. Now head over to an Account record and try it out.

    This is how it looks on the old/legacy User Interface:

    pastedimage1576446411141v10.png

    This is how it looks on the new/unified User Interface:

    pastedimage1576446495746v11.png

    And of course: If you set the value to anything else but 1, the dialog will not open:

    pastedimage1576446538052v12.png

    10. Long story, short: Of course you can open the Dialog without checking any values but just on an onChange Event. In order to so, you don't need to pass the execution context (don't set the tick when adding the onChange Event) and the function would look like this:

    function OpenAlert(){
    
    	//Set the necessarry parameters for the Alert Dialog like the Label of the Confimation Button, the text and the Title of the Dialog
    	var alertStrings = { confirmButtonLabel: "Yes", text: "This is an alert.", title: "Sample title" };
    	//Set the width and height of the Dialog
    	var alertOptions = { height: 120, width: 260 };
    
    	//Call/open the dialog passing the parameters
    	Xrm.Navigation.openAlertDialog(alertStrings, alertOptions).then(
    	    function success(result) {
    	        console.log("Alert dialog closed");
    	    },
    	    function (error) {
    	        console.log(error.message);
    	    }
    	);
    }

    I hope that my little example helps you to understand how to open the official Microsoft Client-API Alert Dialog. If you check out the official Documentary you will see that a lot of "utility", "navigation", "webapi" or "device" functionalities still are to use via the "Xrm.". Anything else like entity, process (BPF), tabs, sections are available via the formContext which is always retrieved from the executionContext, which is being passed as the first parameter.

    One exception for the formContext is when you work with Ribbons (e.g. RibbonWorkbench) in order to build your own buttons on forms. In there you will need to pass the "PrimaryControl" which actually is the formContext in that case.

    But.... this is another story to learn and play with 

    P.S.: If you are seriously thinking about writing code more often, I strongly recommend to use a good Editor or Developing Suite. These tools will help you a lot with the syntax and similar stuff. If you are just beginning to learn, I would recommend something "light" like SubLime or VisualStudioCode. If you are advancing and want to get the professional tools for developing, Visual Studio 2019 is definitely the way to go.

  • CaseyB Profile Picture
    1,135 on at

    Evgeniy, thanks for providing so much information on the Client-API, JavaScript, and related topics.

    I know how to use VisualStudioCode already and that is my Go To HTML, CSS and JScript Coding tool.

    I will follow your Alert example and try to mock up a custom Alert example in my own Microsoft Dynamics CRM Cloud.

    P.S. I will keep you posted on my progress

    Thanks again!

    Casey

  • CaseyB Profile Picture
    1,135 on at

    Evgeniy,

    A few more questions, on my customization (i.e., Alert):

    (1) Can I just use my Live Demo Environment for this custom Alert?

    Note: I have created an Unmanaged Solution Environment with just Account and Contact Entity, but none of the Forms are there because I have not added any Forms

    (2) What Account form should I use (i.e., Account Card form, Sales Insights, Account) ?

    (3) After I choose the correct Account Form, I just begin the starting point by adding a custom integer field called 'Alert Demo' ?  

    Please help!

    Thanks,


    Casey

  • Suggested answer
    Community Member Profile Picture
    on at

    Hey Casey,

    (1) Can I just use my Live Demo Environment for this custom Alert?

    > It actually depends on what you mean with "Live Demo". There are different scenarios how instances are set up. When considering a customer there are usually 2 instances when a customer purchases a subscription: A sandbox and a productive instance. The best scenarion, at least what we advice our customers is to have 1 productive instance and 2 sandboxes. 1st Sandbox is the development instance where all things are "created" in an unmanaged solution which is basically just a container containing your customizations, the 2nd Sandbox is a UAT instance where we import the things from the DEV as managed solutions. The UAT shall be something like an exact copy of the productive instance in order to prove the concepts, usually tested by some key users from the customer. and finally you got the productive instance, where you import the customizations as managed solutions and all users of the customer are working.

    (2) What Account form should I use (i.e., Account Card form, Sales Insights, Account) ?

    > Sorry I didn't mention that in my example before. I would always recommend to make a copy of the standard/main form that is used. So usually you will have several forms just as you said. but there is always one form that is the "main" one to use in the instance:

    pastedimage1576705358962v1.png

    I would recommend to open that form and perform a "Save As" in the left upper corner to create an exact copy of it. In that copy you can try/play with customizations and developments and migrate them to the main form(s) later on if successful. That means you will need to add the main form to your solution in order to open it and make a copy of it. Once you created a copy, you can remove the standard form from your solution again.

    (3) After I choose the correct Account Form, I just begin the starting point by adding a custom integer field called 'Alert Demo' ?  

    > If you created a solution and added the wanted entities to it, you can e.g. start by creating a custom field just as described in my example. Keep in mind, it is just an example. But yes, you could add a field and then put it on your (copy) form and then create a WebResource/JS-Library, add it to that form and register some events to your custom field.

  • CaseyB Profile Picture
    1,135 on at

    Evgeniy,

    I was able to create a copy of Account Form, which I called 'AccountDev'. The new AccountDev Form state says Unmanaged. I also created a custom integer field.

    I am having trouble adding a new 'Alert Demo' section that contains the custom field, as I don't how insert the section or area to the Body of AccountDev Form (above Summary). Do I add a Quick View Form called Alert Demo ?

    Please help!

    Thanks,

    Casey          

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Responsible AI policies

As AI tools become more common, we’re introducing a Responsible AI Use…

Neeraj Kumar – Community Spotlight

We are honored to recognize Neeraj Kumar as our Community Spotlight honoree for…

Leaderboard > Customer experience | Sales, Customer Insights, CRM

#1
Tom_Gioielli Profile Picture

Tom_Gioielli 170 Super User 2025 Season 2

#2
#ManoVerse Profile Picture

#ManoVerse 61

#3
Gerardo Rentería García Profile Picture

Gerardo Rentería Ga... 52 Most Valuable Professional

Last 30 days Overall leaderboard

Product updates

Dynamics 365 release plans