Skip to content

Find User Id

Jump to bottom Edit New page
PhuocLe edited this page Jul 1, 2024 · 40 revisions

In this example, we demonstrate how easy it is to build a dialog similar to out-of-the-box (OOB) dialogs using Dataverse Dialog Builder.

The dialog we should build like this
dialog

As depicted in the image, the dialog includes a header, subheader, a user name textbox (which can default to the current user's login), and a read-only textbox displaying the user id (of GUID type). When the user clicks the Find button, the dialog returns the user id, and the Close button closes the dialog.

Let's get started building a dialog using Dataverse Dialog Builder.

1. Create a JavaScript file and upload to your Dataverse environment

"use strict";
var FindUserId = (function () {
    "use strict";
    async function OnOpen(executionContext) {
    }
    async function OnLoad(executionContext) {
    }
    async function OnClickFind(executionContext) {
    }
    async function OnClickClose(executionContext) {
    }
    return {
        OnOpen,
        OnLoad,
        OnClickFind,
        OnClickClose
    }
})();

2. Drag and drop controls to Dataverse Dialog Builder designer as the picture below

00

# Control Properties
1 Metadata 01
2 Parameter 02
3 Parameter 03
4 Event 04
5 Event 05
6 Event 06
7 Label 07
8 Label 08
9 Tab 09
10 Section 10
11 TextBox 11
12 TextBox 12
13 Button 13
14 Button 14

3. Update your JavaScript code

"use strict";
var FindUserId = (function () {
    "use strict";
    async function OnOpen(executionContext) {
        const options = {
            position: 1,
            width: 600,
            height: 270
        };
        const { userName } = Xrm.Utility.getGlobalContext().userSettings;
        const params = {
            pl_input_user_name: userName
        };
        const result = await Xrm.Navigation.openDialog("pl_find_user_id", options, params);
        if (result?.parameters?.pl_output_user_id?.length > 0) {
            //continue working with the user id you found ...
        }
    }
    async function OnLoad(executionContext) {
        const formContext = executionContext.getFormContext();
        const pl_input_user_name = formContext.getAttribute("pl_input_user_name").getValue();
        formContext.getAttribute("pl_textbox_user_name").setValue(pl_input_user_name);
    }
    async function OnClickFind(executionContext) {
        const formContext = executionContext.getFormContext();
        const userName = formContext.getAttribute("pl_textbox_user_name").getValue();
        const fetchData = {
            fullname: userName
        };
        let fetchXml = `
<fetch version='1.0' output-format='xml-platform' mapping='logical' distinct='false'>
  <entity name='systemuser'>
    <attribute name='systemuserid'/>
    <filter type='and'>
      <condition attribute='fullname' operator='eq' value='${fetchData.fullname}'/>
    </filter>
  </entity>
</fetch>
`;
        fetchXml = "?fetchXml=" + encodeURIComponent(fetchXml);
        Xrm.Utility.showProgressIndicator("Processing ...");
        const response = await Xrm.WebApi.retrieveMultipleRecords("systemuser", fetchXml);
        Xrm.Utility.closeProgressIndicator();
        if (response.entities.length === 1) {
            const entity = response.entities[0];
            userId = entity.systemuserid;
            formContext.getAttribute("pl_textbox_user_id").setValue(userId.toUpperCase());
            formContext.getAttribute("pl_output_user_id").setValue(userId.toUpperCase());
        }
        else {
            formContext.getAttribute("pl_textbox_user_id").setValue(null);
            formContext.getAttribute("pl_output_user_id").setValue(null);
        }
    }
    async function OnClickClose(executionContext) {
        const formContext = executionContext.getFormContext();
        formContext.ui.close();
    }
    return {
        OnOpen,
        OnLoad,
        OnClickFind,
        OnClickClose
    }
})();

4. Explain code

  • You used Xrm.Navigation.openDialog(...) to open dialog with logical name pl_find_user_id that you already declare in Metadata (number 1).
  • All your knowledge of JavaScript remains the same as what you're already familiar with develop Main, Quick Create form.

5. The picture below show when you open Dialog

dialog

6. When user click the Find button. The code FindUserId.OnClickFind execute by your declare Event (number 5).

dialog2

7. The result object return after user click the Close button. The code FindUserId.OnClickClose execute by your declare Event (number 6).

result

8. And now, you can add Dialog to your solution and ready to deploy to another environment

solution1

solution2

9. Finally, you can check FormXml {6ddd87bc-7f24-ef11-840b-00224856e701}.xml generated by Dataverse Dialog Builder.

<?xml version="1.0" encoding="utf-8"?>
<Dialog xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
  <LocalizedNames>
    <LocalizedName description="Find User Id by User Name" languagecode="1033" />
  </LocalizedNames>
  <Descriptions>
    <Description description="Find User Id by User Name" languagecode="1033" />
  </Descriptions>
  <FormId>{6ddd87bc-7f24-ef11-840b-00224856e701}</FormId>
  <UniqueName>pl_find_user_id</UniqueName>
  <IsCustomizable>1</IsCustomizable>
  <IntroducedVersion>1.0.0.0</IntroducedVersion>
  <IsTabletEnabled>0</IsTabletEnabled>
  <CanBeDeleted>1</CanBeDeleted>
  <FormXml>
    <forms type="dialog">
      <form>
        <formparameters>
          <querystringparameter name="pl_input_user_name" type="SafeString" />
          <querystringparameter name="pl_output_user_id" type="SafeString" />
        </formparameters>
        <events>
          <event name="onload" application="false" active="false">
            <Handlers>
              <Handler functionName="FindUserId.OnLoad" libraryName="$webresource:pl_/js/FindUserId.js" handlerUniqueId="{53672652-1D07-40D2-B24C-74D5AA11933D}" enabled="true" parameters="" passExecutionContext="true" />
            </Handlers>
          </event>
          <event name="onclick" application="false" active="false" attribute="pl_button_ok">
            <Handlers>
              <Handler functionName="FindUserId.OnClickFind" libraryName="$webresource:pl_/js/FindUserId.js" handlerUniqueId="{BB7553DF-321A-4FBD-BC92-5FE75199AE5C}" enabled="true" parameters="" passExecutionContext="true" />
            </Handlers>
          </event>
          <event name="onclick" application="false" active="false" attribute="pl_button_cancel">
            <Handlers>
              <Handler functionName="FindUserId.OnClickClose" libraryName="$webresource:pl_/js/FindUserId.js" handlerUniqueId="{8C859290-0D77-44F6-8EC8-53ED82CF0522}" enabled="true" parameters="" passExecutionContext="true" />
            </Handlers>
          </event>
        </events>
        <header id="{6FD1D0A2-706F-40D4-A1FF-EDEB69E421F2}">
          <rows>
            <row>
              <cell id="{6348342B-F5DC-4703-813B-791BEFDB1F6E}" visible="true" rowspan="1">
                <labels>
                  <label description="FIND USER ID" languagecode="1033" />
                </labels>
                <control uniqueid="{5E9AF298-F9F3-41ED-B38D-3C184F107F6C}" id="pl_label_header" classid="{39354E4A-5015-4D74-8031-EA9EB73A1322}" isunbound="true">
                  <parameters>
                    <IsTitle>true</IsTitle>
                  </parameters>
                </control>
              </cell>
            </row>
            <row>
              <cell id="{55229F65-C498-4499-A4F8-67CF73138728}" visible="true" rowspan="1">
                <labels>
                  <label description="Provide your User Name and we find your User Id (GUID)" languagecode="1033" />
                </labels>
                <control uniqueid="{B5748F52-689C-4937-A1A8-6E1709C7C462}" id="pl_label_subheader" classid="{39354E4A-5015-4D74-8031-EA9EB73A1322}" isunbound="true">
                  <parameters>
                    <IsTitle>false</IsTitle>
                  </parameters>
                </control>
              </cell>
            </row>
          </rows>
        </header>
        <tabs>
          <tab id="{E9293BA9-78DB-46CA-A7F4-9C609A806C5E}" name="tab_main" visible="true" expanded="true" verticallayout="true" locklevel="0">
            <labels>
              <label description="" languagecode="1033" />
            </labels>
            <columns>
              <column width="100%">
                <sections>
                  <section id="{AFA8D1FC-44AC-4524-9175-F5873B705FE9}" name="section_main" labelwidth="300" showlabel="false" visible="true" celllabelalignment="Left" celllabelposition="Left">
                    <labels>
                      <label description="" languagecode="1033" />
                    </labels>
                    <rows>
                      <row>
                        <cell id="{0AC6A9D4-E082-4B74-A589-860904A7350D}" visible="true">
                          <labels>
                            <label description="User Name" languagecode="1033" />
                          </labels>
                          <control uniqueid="{3D078A01-EBB8-4453-A932-40D3562751E1}" id="pl_textbox_user_name" classid="{4273EDBD-AC1D-40D3-9FB2-095C621B552D}" isrequired="true" disabled="false" isunbound="true">
                            <parameters>
                              <MaxLength>200</MaxLength>
                              <Format>SingleLineOfText</Format>
                            </parameters>
                          </control>
                        </cell>
                      </row>
                      <row>
                        <cell id="{E18E138F-12A2-414E-A499-FFFCE75B99BE}" visible="true">
                          <labels>
                            <label description="User Id" languagecode="1033" />
                          </labels>
                          <control uniqueid="{9AF1F4C4-B4CB-4D2F-861C-46D2D7657A8C}" id="pl_textbox_user_id" classid="{4273EDBD-AC1D-40D3-9FB2-095C621B552D}" isrequired="false" disabled="true" isunbound="true">
                            <parameters>
                              <MaxLength>36</MaxLength>
                              <Format>SingleLineOfText</Format>
                            </parameters>
                          </control>
                        </cell>
                      </row>
                    </rows>
                  </section>
                </sections>
              </column>
            </columns>
          </tab>
        </tabs>
        <footer id="{7F551F50-4351-494A-AD84-AA8DCBFDE97B}">
          <rows>
            <row>
              <cell id="{2739177D-0ACC-478A-8C70-3EF6CAF87F12}" visible="true">
                <labels>
                  <label description="Find" languagecode="1033" />
                </labels>
                <control uniqueid="{8F966C8C-1DC7-4E94-9FBB-6901EE0427C8}" id="pl_button_ok" classid="{00AD73DA-BD4D-49C6-88A8-2F4F4CAD4A20}" disabled="false" isunbound="true" />
              </cell>
              <cell id="{60AB8D36-3C48-4840-81A4-58E6260A2379}" visible="true">
                <labels>
                  <label description="Close" languagecode="1033" />
                </labels>
                <control uniqueid="{B6E3DA04-03D2-4642-8756-5DFBAC3E4C2B}" id="pl_button_cancel" classid="{00AD73DA-BD4D-49C6-88A8-2F4F4CAD4A20}" disabled="false" isunbound="true" />
              </cell>
            </row>
          </rows>
        </footer>
      </form>
    </forms>
  </FormXml>
</Dialog>
Add a custom footer
Clone this wiki locally