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

Announcements

No record found.

News and Announcements icon
Community site session details

Community site session details

Session Id :
Dynamics 365 Community / Forums / Customer experience | Sales, Customer Insights,... / Javascript, OnChange i...
Customer experience | Sales, Customer Insights,...
Answered

Javascript, OnChange isn't triggering until second selection?

(0) ShareShare
ReportReport
Posted on by Cayshin 2

Let me preface that I have very little knowledge of what I'm doing, I've mostly googled to get this far.

I have an OptionSet (Yes/No) field on my form. 

I've set a OnChange Event for the field it to trigger a Javascript function.

The Javascript function checks if the value of the field is Yes, and if so it makes a WebResource visible.

It "sort of" works, but it requires me to toggle away from Yes before the WebResource is shown.

I.E. If the field is defaulted to [ -- Select -- and I choose [ Yes , nothing happens. But as soon as I toggle from [ Yes to any other value (No or back to default --Select--), then the function triggers and the WebResource is shown. So apparently OnChange is seeing the previous value when I change the field??? I can't seem to make head-or-tails of what actually causes the OnChange to trigger.

Below is a sample of my code:

function SetInvisibleWebResource(executionContext) {
    var formContext = executionContext.getFormContext();    
    var Q1 = formContext.getAttribute("crc7b_segment1").getValue();

     if (Q1 !== null){
             if (Q1 == 260830000){ 
            formContext.getControl("WebResource_Segmentation_1").setVisible(true);
        }}
}

 260830000 is the value of Yes

Can anyone help point out what I'm doing wrong?

  • Suggested answer
    a33ik Profile Picture
    a33ik 84,331 Most Valuable Professional on at

    Hello,

    Try to use the following code:

    function SetInvisibleWebResource(executionContext) {
	var formContext = executionContext.getFormContext();    
	var Q1 = formContext.getAttribute("crc7b_segment1").getValue();

	formContext.getControl("WebResource_Segmentation_1").setVisible(Q1 === 260830000);
}

  • Cayshin Profile Picture
    Cayshin 2 on at

    Hi Andrew,

    Thanks for the suggestion; however, the same issue persists.

    Here's a video of what's happening.

    [View:/cfs-file/__key/communityserver-discussions-components-files/117/Javascript-Issue.mp4:426:320]

    Notice how the URL links only appear after I select away from [ Yes ].

  • Esteban Coto Alfaro Profile Picture
    Esteban Coto Alfaro Microsoft Employee on at

    Hello, try this:

    function SetInvisibleWebResource(executionContext) {

       var formContext = executionContext.getFormContext();

       // OnChange must execute this even if the field is in "-- Select --" and you change to "Yes"

       formContext.getAttribute("crc7b_segment1").addOnChange(SetInvisibleWebResource_aux);

    }

    function SetInvisibleWebResource_aux(formContext) {

       var Q1 = formContext.getAttribute("crc7b_segment1").getValue();

       if (Q1 !== null){

                if (Q1 == 260830000){

               formContext.getControl("WebResource_Segmentation_1").setVisible(true);

           }}

    }

    I hope this work!

    Thanks!

    Community Support Team - Esteban

    If this Post helps, then please consider Accept as solution to help the other members find it more quickly.

  • Suggested answer
    meelamri Profile Picture
    meelamri 13,218 User Group Leader on at

    Hi, 

    I think that the issue is not in your JS code..can you please change your actual control with another one ? 

  • Cayshin Profile Picture
    Cayshin 2 on at

    Hi Mehdi,

    I'm sorry, I'm very new to customizing CRM forms and am ignorant of most of the terms and what they mean/reference. When you say "actual control" what's that?

    Would the control be my OptionSet field with the Yes/No selections? If so, I've tested it using the Two Options field type but ran into the same issue.

  • Suggested answer
    Cayshin Profile Picture
    Cayshin 2 on at

    Ok, so I figured out a messy way that "works". I had stop using formContext and go back to Xrm.page (I don't know enough about CRM to know what the difference is or why/when to use one over the other), Then I had to create a duplicate of my below javascript.

    function SetInvisibleWebResource() {

    if (Xrm.Page.getAttribute("crc7b_segment1").getValue() == 260830000 && Xrm.Page.getControl("crc7b_segment1").getVisible() == true){
        Xrm.Page.getControl("crc7b_segment2").setVisible(false);
        Xrm.Page.getControl("crc7b_segment3").setVisible(false);
        Xrm.Page.getControl("crc7b_segment4").setVisible(false);
        Xrm.Page.getControl("crc7b_segment5").setVisible(false);
        Xrm.Page.getAttribute("tcg_segmentationmodel").setValue(260830000);
        Xrm.Page.getAttribute("tcg_segmentationmodel").fireOnChange();
    }
    else if (Xrm.Page.getAttribute("crc7b_segment1").getValue() == 260830001 && Xrm.Page.getControl("crc7b_segment1").getVisible() == true && Xrm.Page.getControl("crc7b_segment2").getVisible() == false){
        Xrm.Page.getControl("crc7b_segment2").setVisible(true);
        Xrm.Page.getAttribute("crc7b_segment2").setValue(null);
    }
    
    if (Xrm.Page.getAttribute("crc7b_segment2").getValue() == 260830000 && Xrm.Page.getControl("crc7b_segment2").getVisible() == true){
        Xrm.Page.getControl("crc7b_segment3").setVisible(false);
        Xrm.Page.getControl("crc7b_segment4").setVisible(false);
        Xrm.Page.getControl("crc7b_segment5").setVisible(false);
        Xrm.Page.getAttribute("tcg_segmentationmodel").setValue(799640000);
        Xrm.Page.getAttribute("tcg_segmentationmodel").fireOnChange();
    }
    else if (Xrm.Page.getAttribute("crc7b_segment2").getValue() == 260830001 && Xrm.Page.getControl("crc7b_segment2").getVisible() == true && Xrm.Page.getControl("crc7b_segment3").getVisible() == false){
        Xrm.Page.getControl("crc7b_segment3").setVisible(true);
        Xrm.Page.getAttribute("crc7b_segment3").setValue(null);
    }
    
    if (Xrm.Page.getAttribute("crc7b_segment3").getValue() == 260830000 && Xrm.Page.getControl("crc7b_segment3").getVisible() == true){
        Xrm.Page.getControl("crc7b_segment4").setVisible(false);
        Xrm.Page.getControl("crc7b_segment5").setVisible(false);
        Xrm.Page.getAttribute("tcg_segmentationmodel").setValue(799640001);
        Xrm.Page.getAttribute("tcg_segmentationmodel").fireOnChange();
    }
    else if (Xrm.Page.getAttribute("crc7b_segment3").getValue() == 260830001 && Xrm.Page.getControl("crc7b_segment3").getVisible() == true && Xrm.Page.getControl("crc7b_segment4").getVisible() == false){
        Xrm.Page.getControl("crc7b_segment4").setVisible(true);
        Xrm.Page.getAttribute("crc7b_segment4").setValue(null);
    }
    
    if (Xrm.Page.getAttribute("crc7b_segment4").getValue() == 260830000 && Xrm.Page.getControl("crc7b_segment4").getVisible() == true){
        Xrm.Page.getControl("crc7b_segment5").setVisible(false);
        Xrm.Page.getAttribute("tcg_segmentationmodel").setValue(799640002);
        Xrm.Page.getAttribute("tcg_segmentationmodel").fireOnChange();
    }
    else if (Xrm.Page.getAttribute("crc7b_segment4").getValue() == 260830001 && Xrm.Page.getControl("crc7b_segment4").getVisible() == true && Xrm.Page.getControl("crc7b_segment5").getVisible() == false){
        Xrm.Page.getControl("crc7b_segment5").setVisible(true);
        Xrm.Page.getAttribute("crc7b_segment5").setValue(null);
    }
    
    if (Xrm.Page.getAttribute("crc7b_segment5").getValue() == 260830000 && Xrm.Page.getControl("crc7b_segment5").getVisible() == true){
        Xrm.Page.getAttribute("tcg_segmentationmodel").setValue(799640003);
        Xrm.Page.getAttribute("tcg_segmentationmodel").fireOnChange();
    }
    else if (Xrm.Page.getAttribute("crc7b_segment2").getValue() == 260830001 && Xrm.Page.getControl("crc7b_segment5").getVisible() == true){
        Xrm.Page.getAttribute("tcg_segmentationmodel").setValue(799640004);
        Xrm.Page.getAttribute("tcg_segmentationmodel").fireOnChange();
    }
    
        }

    So now on the Events for segment_1, segment_2., etc... controls I've added both javascripts.

    Screenshot-2021_2D00_06_2D00_30-111148.png

    I'm sure this is the completely wrong way to do it, but it works so I'm happy =).

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

Season of Sharing Community Challenge Winners!

Congratulations to our community stars!

Women in Power Builds Momentum

Expanding mentorship, skilling, and AI innovation

Congratulations to the August Top 10 Community Leaders

These are the community rock stars!

Leaderboard > Customer experience | Sales, Customer Insights, CRM

#1
Daniyal Khaleel Profile Picture

Daniyal Khaleel 89 Most Valuable Professional

#2
11manish Profile Picture

11manish 67 Super User 2026 Season 2

#3
Travis South Profile Picture

Travis South 39

Last 30 days Overall leaderboard

Featured topics

Hide selecting Contact for potential customer when creating quote

Product updates

Dynamics 365 release plans