Skip to main content

Notifications

Community site session details

Community site session details

Session Id :
Microsoft Dynamics 365 | Integration, Dataverse...
Suggested answer

Update calendar CSS on Portal Entity List

(0) ShareShare
ReportReport
Posted on by 270

I am also working with a Portal Entity List rendered as a full calendar and trying to get the colors set in the system to pull through and replace the default blue, this should be a yellow color and not blue.

pastedimage1599645228849v1.png

  • Community Member Profile Picture
    on at
    RE: Update calendar CSS on Portal Entity List

    Make a fetch XML filter on entity list as per our need

    Fetch XML filter for ‘RequestedShipDate(On or After)’

    <filter type="or" adx:uiinputtype="dynamic" adx:uiname="Ship From Date">
          <condition value="" attribute="new_requestedshipdate" operator="on-or-after" adx:uiinputtype="dynamic" />
    </filter>

    Fetch XML filter for ‘RequestedShipDate(On or Before)’

    <filter type="or" adx:uiinputtype="dynamic" adx:uiname="Ship To Date">
          <condition value="" attribute="new_requestedshipdate" operator="on-or-before" adx:uiinputtype="dynamic" />
    </filter>
    pastedimage1600086289263v1.png

    P.S We need to define type as ‘dynamic’ so that portal will not perform any data transformation on filter options.

    Step 2: Change the check boxes to Text controls

    The Fetch XML filter controls will be displayed as checkboxes in the Entity List Page as shown below. We need to change the ‘type’ as ‘text’ for the checkbox controls to set value for the Dates.

    pastedimage1600086289265v2.png
    pastedimage1600086289267v3.png

    Change the ‘Ship From Date’ check box as Text Box

    //Change the ‘checkbox’ control’s type as Text
    $('[name="7"]').prop('type', 'text'); 
    //Set Unique Id for the control
    $('[name="7"]').prop('id', 'bk_fld_shipDateAfter');
    //Hide the control
    $('[name="7"]').hide();
    //Set null value for the Dates
     $("#bk_fld_shipDateAfter").val("");

    Follow the same above steps to change the ‘Ship To Date’ check box as Text Box

    $("input[type=checkbox][name=8]").prop('id', 'bk_fld_shipDateBefore');
        $("input[type=checkbox][name=8]").hide();
        $("input[type=checkbox][name=8]").prop('type', 'text');
        $("#bk_fld_shipDateBefore").val("");
  • LeoAlt Profile Picture
    16,331 Moderator on at
    RE: Update calendar CSS on Portal Entity List

    Hi Partner,

    So if you want to set the color automatically based on a field in D365, it's going to be a little complicated.

    You should get the option set value from D365 first, you could use liquid and page template to do this, but the final value you get is only the value with number format, not the label. So you still need to find other ways to transfer the value to label.

    After that, you should get the color label in the custom JS in portal and then use them in the background.

    If your color doesn't change very often, I suggest you to get the color code directly and set them into the code manually.

    Regards,

    Leo

  • GRedhead Profile Picture
    270 on at
    RE: Update calendar CSS on Portal Entity List

    It's based on an option set on the appointment.

  • LeoAlt Profile Picture
    16,331 Moderator on at
    RE: Update calendar CSS on Portal Entity List

    Hi Partner,

    Yes, the answer above will make all the color the same. But since we got them in an array, we could set different color for different records based on your requirement.

    Could you share what's the condition for each color?

    Regards,

    Leo

  • GRedhead Profile Picture
    270 on at
    RE: Update calendar CSS on Portal Entity List

    Thanks but i need to change from colour to colour, so one would be green and another blue. the above would set them all to the same colour if i'm right.

  • LeoAlt Profile Picture
    16,331 Moderator on at
    RE: Update calendar CSS on Portal Entity List

    Hi Partner,

    You could use F12 developer tool to get the color code.

    Just put the mouse on the icon and find its color code.

    pastedimage1599729801363v1.png

    Best Regards,

    Leo

  • GRedhead Profile Picture
    270 on at
    RE: Update calendar CSS on Portal Entity List

    Thanks Leo,

    Do you know how to pull the colour from the calendar in CRM?

    pastedimage1599727612721v1.png

  • Suggested answer
    LeoAlt Profile Picture
    16,331 Moderator on at
    RE: Update calendar CSS on Portal Entity List

    Hi Partner,

    If you want to show other background colors, you should replace the default style in Portal.

    Replace the ".event-info" background to "yellow".

    pastedimage1599718175945v1.png

    To do this, you should go to Entity List->Options->Custom JavaScript and add custom JS code.

    $(function () {
        var timesRun = 0;
        var interval = setInterval(function () {
            var cas=$(".event-info");
            if (cas.length!=0) {
                clearInterval(interval);
                for(var i=0;i

    pastedimage1599722035203v3.png

    pastedimage1599722079963v4.png

    Best Regards,

    Leo

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

Announcing the Engage with the Community forum!

This forum is your space to connect, share, and grow!

🌸 Community Spring Festival 2025 Challenge Winners! 🌸

Congratulations to all our community participants!

Adis Hodzic – Community Spotlight

We are honored to recognize Adis Hodzic as our May 2025 Community…

Leaderboard > Microsoft Dynamics 365 | Integration, Dataverse, and general topics

#1
Siv Sagar Profile Picture

Siv Sagar 149 Super User 2025 Season 1

#2
Muhammad Shahzad Shafique Profile Picture

Muhammad Shahzad Sh... 61 Most Valuable Professional

#3
Daivat Vartak (v-9davar) Profile Picture

Daivat Vartak (v-9d... 53 Super User 2025 Season 1

Overall leaderboard

Product updates

Dynamics 365 release plans