PCF date picker

Show the date picker for the student DOB?

User Story : Show the Date picker in student DOB field.

Entity:

StudentWON

Fields:

DateOfBirth (date and time datatype)

Steps to follow:

Create a DateOfBirth field in the student record
Create a PCF and
Import the solution to CRM
Check the output

1) Do you have explorer on PCF control, how to achieve PCF control?

Ans) Yes, PCF control is used to provide rich look of ui part of the CRM for the customer.

My recent PCF control is multiline text box that limit is 2000 characters i will write more than 2000 characters then it will show error

1)create one folder in home-desktop-folder name

2)then install Node.js

3)then install Power apps CLI for this go to visual studio

Open Visual Studio Code.
Select the Extensions icon from the Activity panel. In the search bar, enter Power Platform Tools.
Select Install. Once the installation is finished, restart Visual Studio Code to see the extension within the Terminal window.

4) then open developer command prompt 2019

https://www.crmcrate.com/power-apps/pcf-custom-control-in-dynamics-365-crm-step-by-step-guide/

How to create PCF ?

Open C Drive in your Pc and Create a folder PCFControlFlow02

Open developer Command prompt and To navigate to Your Path enter : cd C:\PCFControlFlow02

To navigate to the path enter cd

C:\Program Files (x86)\Microsoft Visual Studio\2019\Community>cd C:\PCFdateone23

C:\PCFdateone23>

C:\PCFdateone23>pac install latest

Feeds used:

https://api.nuget.org/v3/index.json

Installing package 'Microsoft.PowerApps.CLI' to 'C:\Users\HariT\AppData\Local\Microsoft\PowerAppsCli'.

GET https://api.nuget.org/v3/registration5-gz-semver2/microsoft.powerapps.cli/index.json

OK https://api.nuget.org/v3/registration5-gz-semver2/microsoft.powerapps.cli/index.json 1044ms

Package "Microsoft.PowerApps.CLI.1.31.6" is already installed.

C:\PCFdateone23> pac pcf init

The Power Apps component framework project was successfully created in 'C:\PCFdateone23'.

Be sure to run 'npm install' or equivalent in this directory to install project dependencies.

C:\PCFdateone23> npm install react react-dom @fluentui/react

npm WARN deprecated @babel/plugin-proposal-nullish-coalescing-operator@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-nullish-coalescing-operator instead.

npm WARN deprecated @babel/plugin-proposal-class-properties@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.

npm WARN deprecated @babel/plugin-proposal-object-rest-spread@7.20.7: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-object-rest-spread instead.

added 745 packages, and audited 746 packages in 40s

130 packages are looking for funding

run `npm fund` for details

4 moderate severity vulnerabilities

To address all issues, run:

npm audit fix

Run `npm audit` for details.

C:\PCFdateone23> npm install -–save-dev @types/react @types/react-dom

up to date, audited 746 packages in 1s

130 packages are looking for funding

run `npm fund` for details

4 moderate severity vulnerabilities

To address all issues, run:

npm audit fix

Run `npm audit` for details.

Open Visual Studio and open the folder PCFdateone23

Now change the code in ControlManifest.Input.xml

1) ControlManifest.Input.xml

<?xml version="1.0" encoding="utf-8" ?>

<manifest>

  <control namespace="SampleNamespace" constructor="SampleControl" version="0.0.1" display-name-key="SampleControl" description-key="SampleControl description" control-type="standard" >

     <property name="DateField" display-name-key="Date Field" description-key="Field to be mapped to custom date field" of-type="DateAndTime.DateOnly" usage="bound" required="true" />

    <property name="MinDate" display-name-key="Minimum Date Range" description-key="Configure the minimum range for date control" of-type="Whole.None" usage="input" required="false" />

    <property name="MaxDate" display-name-key="Maximum Date Range" description-key="Configure the maximum range for date control" of-type="Whole.None" usage="input" required="false" />

    <property name="EnableDefault" display-name-key="Enable Default" description-key="Configure the default value for date control" of-type="Whole.None" usage="input" required="false" />

    <property name="SetDefault" display-name-key="Default Date" description-key="Configure the default value for date control or Today date" of-type="Whole.None" usage="input" required="false" />

    <resources>

      <code path="index.ts" order="1" />

      <!-- UNCOMMENT TO ADD MORE RESOURCES

      <css path="css/DatePickerControl.css" order="1" />

      <resx path="strings/DatePickerControl.1033.resx" version="1.0.0" />

-->

    </resources>

    <!-- UNCOMMENT TO ENABLE THE SPECIFIED API

    <feature-usage>

      <uses-feature name="Device.captureAudio" required="true" />

      <uses-feature name="Device.captureImage" required="true" />

      <uses-feature name="Device.captureVideo" required="true" />

      <uses-feature name="Device.getBarcodeValue" required="true" />

      <uses-feature name="Device.getCurrentPosition" required="true" />

      <uses-feature name="Device.pickFile" required="true" />

      <uses-feature name="Utility" required="true" />

      <uses-feature name="WebAPI" required="true" />

    </feature-usage>

-->

  </control>

</manifest>

2) ManifestTypes.d.ts

/*
*This is auto generated from the ControlManifest.Input.xml file
*/

// Define IInputs and IOutputs Type. They should match with ControlManifest.
export interface IInputs {
    DateField: ComponentFramework.PropertyTypes.DateTimeProperty;
    MinDate: ComponentFramework.PropertyTypes.WholeNumberProperty;
    MaxDate: ComponentFramework.PropertyTypes.WholeNumberProperty;
    EnableDefault: ComponentFramework.PropertyTypes.WholeNumberProperty;
    SetDefault: ComponentFramework.PropertyTypes.WholeNumberProperty;
}
export interface IOutputs {
    DateField?: Date;
}

create a new file react file and name it as BIDSL_DatePicker

3) BIDSL_DatePicker.tsx

import * as React from "react";
import {
  DatePicker,
  IDatePickerStrings,
  defaultDatePickerStrings,
  addDays,
  IDatePickerStyles,
  IDatePickerProps,
  IBaseProps,
} from "@fluentui/react";
import { useConst } from "@fluentui/react-hooks";

const datePickerStyles: Partial<IDatePickerStyles> = {
  root: { maxWidth: 300, marginTop: 15 },
};

export interface IDatePickerControlProps extends IBaseProps<IDatePickerProps> {
  disabled?: boolean;
  minDate?: number;
  maxDate?: number;
  enableDefault?: boolean;
  setDefault: number;
  inputDate?: Date;
  inputDateChanged: (newDate: Date | undefined) => void;
}

export const BIDSLDatePickerBounded: React.FunctionComponent<
  IDatePickerControlProps
> = (props) => {
  // initialize the state variables
  const [Value, setValue] = React.useState<Date | undefined>(() => {
    return props.inputDate != undefined
      ? props.inputDate
      : props.enableDefault
      ? useConst(addDays(new Date(Date.now()), props.setDefault))
      : undefined;
  });

  React.useEffect(() => {
    if (props.inputDate !== undefined) {
      setValue(props.inputDate);
    } else {
      setValue(undefined);
    }
  }, [props.inputDate]);

  React.useEffect(() => {
    props.inputDateChanged(Value);
  }, [Value]);

  const onSelectDate = (selectedDate: Date): void => {
    setValue(selectedDate);
  };

  // manipulated the properties based on the input
  const { disabled, minDate, maxDate } = props;

  const today = useConst(new Date(Date.now()));
  // const defaultValue =
  const minimumDate = minDate ? useConst(addDays(today, minDate)) : undefined;
  const maximumDate = maxDate ? useConst(addDays(today, maxDate)) : undefined;

  const strings: IDatePickerStrings = useConst(() => ({
    ...defaultDatePickerStrings,
    isOutOfBoundsErrorMessage: `Date must be between ${minimumDate?.toLocaleDateString()} and ${maximumDate?.toLocaleDateString()}`,
  }));

  return (
    <DatePicker
      styles={datePickerStyles}
      // DatePicker uses English strings by default. For localized apps, you must override this prop.
      strings={strings}
      placeholder=""
      ariaLabel=""
      minDate={minimumDate}
      maxDate={maximumDate}
      value={Value}
      disabled={disabled}
      onSelectDate={onSelectDate as (date: Date | null | undefined) => void}
      formatDate={(date) => {
        return date
          ? date.toLocaleDateString(
              navigator.languages && navigator.languages[0]
            )
          : "";
      }}
    />
  );
};

4) TS index.ts

import * as React from "react";
import { createRoot, Root } from "react-dom/client";
import {
  BIDSLDatePickerBounded,
  IDatePickerControlProps,
} from "./BIDSL_DatePicker";
import { IInputs, IOutputs } from "./generated/ManifestTypes";

export class SampleControl implements ComponentFramework.StandardControl<IInputs, IOutputs> {

    private container: HTMLDivElement;
  private notifyOutputChanged: () => void;
  private root: Root;

  private datePickerProps: IDatePickerControlProps = {
    disabled: false,
    minDate: undefined,
    maxDate: undefined,
    enableDefault: false,
    setDefault: 0,
    inputDate: undefined,
    inputDateChanged: this.inputDateChanged.bind(this),
  };

  private inputDateChanged(newValue: Date | undefined) {
    if (this.datePickerProps.inputDate !== newValue) {
      this.datePickerProps.inputDate = newValue;
      this.notifyOutputChanged();
    }
  }
  constructor() {}

  /**
   * Used to initialize the control instance. Controls can kick off remote server calls and other initialization actions here.
   * Data-set values are not initialized here, use updateView.
   * @param context The entire property bag available to control via Context Object; It contains values as set up by the customizer mapped to property names defined in the manifest, as well as utility functions.
   * @param notifyOutputChanged A callback method to alert the framework that the control has new outputs ready to be retrieved asynchronously.
   * @param state A piece of data that persists in one session for a single user. Can be set at any point in a controls life cycle by calling 'setControlState' in the Mode interface.
   * @param container If a control is marked control-type='standard', it will receive an empty div element within which it can render its content.
   */
  public init(
    context: ComponentFramework.Context<IInputs>,
    notifyOutputChanged: () => void,
    state: ComponentFramework.Dictionary,
    container: HTMLDivElement
  ): void {
    this.container = container;
    this.notifyOutputChanged = notifyOutputChanged;
    // initialize the control parameters with control config
    this.datePickerProps.setDefault = context.parameters.SetDefault.raw ?? 0;
    this.datePickerProps.minDate = context.parameters.MinDate.raw ?? undefined;
    this.datePickerProps.maxDate = context.parameters.MaxDate.raw ?? undefined;
    this.datePickerProps.enableDefault = context.parameters.EnableDefault.raw
      ? context.parameters.EnableDefault.raw == 1
      : false;
    this.datePickerProps.inputDate =
      context.parameters.DateField.raw ?? undefined;

    this.root = createRoot(this.container); // createRoot(container!)
  }

  /**
   * Called when any value in the property bag has changed. This includes field values, data-sets, global values such as container height and width, offline status, control metadata values such as label, visible, etc.
   * @param context The entire property bag available to control via Context Object; It contains values as set up by the customizer mapped to names defined in the manifest, as well as utility functions
   */
  public updateView(context: ComponentFramework.Context<IInputs>): void {
    if (
      this.datePickerProps.inputDate?.setUTCHours(0, 0, 0, 0) !=
      context.parameters.DateField.raw?.setUTCHours(0, 0, 0, 0)
    ) {
      this.datePickerProps.inputDate =
        context.parameters.DateField.raw ?? undefined;
    }

    this.datePickerProps.disabled = context.mode.isControlDisabled;
    this.root.render(
      React.createElement(BIDSLDatePickerBounded, this.datePickerProps)
    );
  }

  /**
   * It is called by the framework prior to a control receiving new data.
   * @returns an object based on nomenclature defined in manifest, expecting object[s] for property marked as “bound” or “output”
   */
  public getOutputs(): IOutputs {
    return {
      DateField: this.datePickerProps.inputDate,
    };
  }

  /**
   * Called when the control is to be removed from the DOM tree. Controls should use this call for cleanup.
   * i.e. cancelling any pending remote calls, removing listeners, etc.
   */
  public destroy(): void {
    // Add code to cleanup control if necessary
    this.root.unmount();
  }
}

Make the changes and save all the files and go to Developer Command Prompt again

C:\PCFdateone23>npm start watch

> pcf-project@1.0.0 start

> pcf-scripts start watch

[7:39:16 pm] [start] [watch] Initializing...

[7:39:16 pm] [start] [watch] Validating manifest...

[7:39:16 pm] [start] [watch] Validating control...

[7:39:17 pm] [start] [watch] Generating manifest types...

DeprecationWarning: 'createInterfaceDeclaration' has been deprecated since v4.8.0. Decorators are no longer supported for this function. Callers should switch to an overload that does not accept a 'decorators' parameter.

[7:39:17 pm] [start] [watch] Generating design types...

[7:39:17 pm] [start] [watch] Compiling and bundling control...

[BABEL] Note: The code generator has deoptimised the styling of C:\PCFdateone23\node_modules\react-dom\cjs\react-dom.development.js as it exceeds the max of 500KB.

[Webpack stats]:

asset bundle.js 1.94 MiB [compared for emit] (name: main)

orphan modules 1.96 MiB [orphan] 844 modules

runtime modules 1.25 KiB 6 modules

cacheable modules 1.58 MiB

modules by path ./node_modules/@fluentui/ 629 KiB 204 modules

modules by path ./node_modules/react-dom/ 843 KiB 3 modules

modules by path ./SampleControl/ 5.94 KiB 2 modules

modules by path ./node_modules/react/ 94.5 KiB

./node_modules/react/index.js 189 bytes [built] [code generated]

./node_modules/react/cjs/react.development.js 94.3 KiB [built] [code generated]

modules by path ./node_modules/scheduler/ 19.2 KiB

./node_modules/scheduler/index.js 197 bytes [built] [code generated]

./node_modules/scheduler/cjs/scheduler.development.js 19 KiB [built] [code generated]

./node_modules/tslib/tslib.es6.mjs 15.9 KiB [built] [code generated]

./node_modules/@microsoft/load-themed-styles/lib-es6/index.js 10 KiB [built] [code generated]

webpack 5.91.0 compiled successfully in 10237 ms

[7:39:28 pm] [start] [watch] Generating build outputs...

[7:39:28 pm] [start] [watch] Starting control harness...

Starting control harness...

[Browsersync] Access URLs:

----------------------------

Local: http://localhost:8181

----------------------------

[Browsersync] Serving files from: C:\PCFdateone23\out\controls\SampleControl

[Browsersync] Watching files...

[BABEL] Note: The code generator has deoptimised the styling of C:\PCFdateone23\node_modules\react-dom\cjs\react-dom.development.js as it exceeds the max of 500KB.

[Browsersync] Reloading Browsers...

This is the result we can see in Your Browser:

To get out from it from above process

type control + C in Developer command prompt

Terminate batch job (Y/N)? Y

C:\PCFdateone23>mkdir solution

C:\PCFdateone23>cd solution

C:\PCFdateone23\solution>pac solution init --publisher-name developer --publisher-prefix dev

Dataverse solution project with name 'solution' created successfully in: 'C:\PCFdateone23\solution'

Dataverse solution files were successfully created for this project in the sub-directory Other, using solution name solution, publisher name developer, and customization prefix dev.

Please verify the publisher information and solution name found in the Solution.xml file.

C:\PCFdateone23\solution> pac solution add-reference --path C:\PCFdateone23

Project reference successfully added to Dataverse solution project.

C:\PCFdateone23\solution>msbuild /t:restore

Microsoft (R) Build Engine version 16.11.2+f32259642 for .NET Framework

Build started 23-04-2024 19:52:45.

Project "C:\PCFdateone23\solution\solution.cdsproj" on node 1 (Restore target(s)).

_GetAllRestoreProjectPathItems:

Determining projects to restore...

Restore:

Restoring packages for C:\PCFdateone23\solution\solution.cdsproj...

Restoring packages for C:\PCFdateone23\PCFdateone23.pcfproj...

GET https://api.nuget.org/v3-flatcontainer/microsoft.powerapps.msbuild.solution/index.json

GET https://api.nuget.org/v3-flatcontainer/microsoft.powerapps.msbuild.pcf/index.json

OK https://api.nuget.org/v3-flatcontainer/microsoft.powerapps.msbuild.solution/index.json 1020ms

GET https://api.nuget.org/v3-flatcontainer/microsoft.powerapps.msbuild.solution/1.31.2/microsoft.powerapps.msbuild.

solution.1.31.2.nupkg

OK https://api.nuget.org/v3-flatcontainer/microsoft.powerapps.msbuild.solution/1.31.2/microsoft.powerapps.msbuild.s

olution.1.31.2.nupkg 22ms

OK https://api.nuget.org/v3-flatcontainer/microsoft.powerapps.msbuild.pcf/index.json 1083ms

GET https://api.nuget.org/v3-flatcontainer/microsoft.powerapps.msbuild.pcf/1.31.2/microsoft.powerapps.msbuild.pcf.1

.31.2.nupkg

OK https://api.nuget.org/v3-flatcontainer/microsoft.powerapps.msbuild.pcf/1.31.2/microsoft.powerapps.msbuild.pcf.1.

31.2.nupkg 20ms

Installed Microsoft.PowerApps.MSBuild.Pcf 1.31.2 from https://api.nuget.org/v3/index.json with content hash UzimaMndq

FUIByzVFAOWW6NT+iUAYmEzvIRhNChULxgT5GT7jTi1ni4kUtSRNVP46xH70qBJo5GaRvP2rs5Omw==.

Committing restore...

Generating MSBuild file C:\PCFdateone23\obj\PCFdateone23.pcfproj.nuget.g.props.

Generating MSBuild file C:\PCFdateone23\obj\PCFdateone23.pcfproj.nuget.g.targets.

Writing assets file to disk. Path: C:\PCFdateone23\obj\project.assets.json

Restored C:\PCFdateone23\PCFdateone23.pcfproj (in 4.87 sec).

Installed Microsoft.PowerApps.MSBuild.Solution 1.31.2 from https://api.nuget.org/v3/index.json with content hash ABZ7

i1iB8OthtdqCVHGaMwt/ViyJ6KEpkVGSxHSndf4f6S2kRIw7bLLwRmuxhJKWI9dzjA/hOkjA04gwTRhbPA==.

Committing restore...

Generating MSBuild file C:\PCFdateone23\solution\obj\solution.cdsproj.nuget.g.props.

Generating MSBuild file C:\PCFdateone23\solution\obj\solution.cdsproj.nuget.g.targets.

Writing assets file to disk. Path: C:\PCFdateone23\solution\obj\project.assets.json

Restored C:\PCFdateone23\solution\solution.cdsproj (in 10.9 sec).

NuGet Config files used:

C:\Users\HariT\AppData\Roaming\NuGet\NuGet.Config

C:\Program Files (x86)\NuGet\Config\Microsoft.VisualStudio.Offline.config

Feeds used:

https://api.nuget.org/v3/index.json

C:\Program Files (x86)\Microsoft SDKs\NuGetPackages\

Installed:

1 package(s) to C:\PCFdateone23\PCFdateone23.pcfproj

2 package(s) to C:\PCFdateone23\solution\solution.cdsproj

Done Building Project "C:\PCFdateone23\solution\solution.cdsproj" (Restore target(s)).

Build succeeded.

0 Warning(s)

0 Error(s)

Time Elapsed 00:00:12.68

C:\PCFdateone23\solution>msbuild

Microsoft (R) Build Engine version 16.11.2+f32259642 for .NET Framework

Build started 23-04-2024 19:53:14.

Project "C:\PCFdateone23\solution\solution.cdsproj" on node 1 (default targets).

PrepareForBuild:

Creating directory "bin\Debug\".

Creating directory "obj\Debug\".

Project "C:\PCFdateone23\solution\solution.cdsproj" (1) is building "C:\PCFdateone23\PCFdateone23.pcfproj" (2:2) on nod

e 1 (default targets).

RestoreNPM:

Restoring NPM packages...

npm install

up to date, audited 746 packages in 3s

130 packages are looking for funding

run `npm fund` for details

4 moderate severity vulnerabilities

To address all issues, run:

npm audit fix

Run `npm audit` for details.

Touching "node_modules/pcf-scripts/package.json".

PrepareForBuild:

Creating directory "obj\Debug\".

PcfBuild:

npm run build -- --noColor --buildMode development --outDir "C:\PCFdateone23\out\controls" --buildSource MSBuild

> pcf-project@1.0.0 build

> pcf-scripts build --noColor --buildMode development --outDir C:\PCFdateone23\out\controls --buildSource MSBuild

[7:53:22 pm] [build] Initializing...

[7:53:22 pm] [build] Validating manifest...

[7:53:22 pm] [build] Validating control...

[7:53:23 pm] [build] Generating manifest types...

DeprecationWarning: 'createInterfaceDeclaration' has been deprecated since v4.8.0. Decorators are no longer supported

for this function. Callers should switch to an overload that does not accept a 'decorators' parameter.

[7:53:23 pm] [build] Generating design types...

[7:53:23 pm] [build] Running ESLint...

[7:53:24 pm] [build] Compiling and bundling control...

[BABEL] Note: The code generator has deoptimised the styling of C:\PCFdateone23\node_modules\react-dom\cjs\react-dom.

development.js as it exceeds the max of 500KB.

[Webpack stats]:

asset bundle.js 1.94 MiB [emitted] (name: main)

orphan modules 1.96 MiB [orphan] 844 modules

runtime modules 1.25 KiB 6 modules

cacheable modules 1.58 MiB

modules by path ./node_modules/@fluentui/ 629 KiB 204 modules

modules by path ./node_modules/react-dom/ 843 KiB 3 modules

modules by path ./SampleControl/ 5.94 KiB 2 modules

modules by path ./node_modules/react/ 94.5 KiB

./node_modules/react/index.js 189 bytes [built] [code generated]

./node_modules/react/cjs/react.development.js 94.3 KiB [built] [code generated]

modules by path ./node_modules/scheduler/ 19.2 KiB

./node_modules/scheduler/index.js 197 bytes [built] [code generated]

./node_modules/scheduler/cjs/scheduler.development.js 19 KiB [built] [code generated]

./node_modules/tslib/tslib.es6.mjs 15.9 KiB [built] [code generated]

./node_modules/@microsoft/load-themed-styles/lib-es6/index.js 10 KiB [built] [code generated]

webpack 5.91.0 compiled successfully in 10830 ms

[7:53:36 pm] [build] Generating build outputs...

[7:53:36 pm] [build] Succeeded

Done Building Project "C:\PCFdateone23\PCFdateone23.pcfproj" (default targets).

ResolveAssemblyReferences:

Primary reference "PCFdateone23".

Could not find dependent files. Expected file "C:\PCFdateone23\out\controls\PCFdateone23.exe" does not exist.

Resolved file path is "C:\PCFdateone23\out\controls\PCFdateone23.exe".

Reference found at search path location "".

The ImageRuntimeVersion for this reference is "".

CopyCdsSolutionContent:

Creating directory "obj\Debug\Metadata\Other".

Copying file from "C:\PCFdateone23\solution\src\Other\Customizations.xml" to "C:\PCFdateone23\solution\obj\Debug\Meta

data\Other\Customizations.xml".

Copying file from "C:\PCFdateone23\solution\src\Other\Relationships.xml" to "C:\PCFdateone23\solution\obj\Debug\Metad

ata\Other\Relationships.xml".

Copying file from "C:\PCFdateone23\solution\src\Other\Solution.xml" to "C:\PCFdateone23\solution\obj\Debug\Metadata\O

ther\Solution.xml".

ProcessCdsProjectReferencesOutputs:

Processing output of component type: Pcf, source output directory: C:\PCFdateone23\out\controls\, destination directo

ry: C:\PCFdateone23\solution\obj\Debug\Metadata\Controls

Process: Output copied from source directory: C:\PCFdateone23\out\controls\SampleControl to destination directory: C:

\PCFdateone23\solution\obj\Debug\Metadata\Controls\dev_SampleNamespace.SampleControl

Process: Control data node created in C:\PCFdateone23\solution\obj\Debug\Metadata\Controls\dev_SampleNamespace.Sample

Control

Process: Root Component of type: 66, schema name: dev_SampleNamespace.SampleControl added to Solution

PowerAppsPackage:

Running Solution Packager to build package type: Unmanaged bin\Debug\solution.zip

Packing C:\PCFdateone23\solution\obj\Debug\Metadata to bin\Debug\solution.zip

Processing Component: Entities

Processing Component: Roles

Processing Component: Workflows

Processing Component: FieldSecurityProfiles

Processing Component: Templates

Processing Component: EntityMaps

Processing Component: EntityRelationships

Processing Component: OrganizationSettings

Processing Component: optionsets

Processing Component: CustomControls

- SampleNamespace.SampleControl

Processing Component: SolutionPluginAssemblies

Processing Component: EntityDataProviders

Processing Sharded Component Files

Unmanaged Pack complete.

Solution: bin\Debug\solution.zip generated.

Solution Package Type: Unmanaged generated.

Solution Packager log path: obj\Debug\SolutionPackager.log.

Solution Packager error level: Info.

CleanUpIntermediateFiles:

Removing directory "obj\Debug\Metadata".

Completed intermiediate files clean up.

Done Building Project "C:\PCFdateone23\solution\solution.cdsproj" (default targets).

Build succeeded.

0 Warning(s)

0 Error(s)

Time Elapsed 00:00:23.90

C:\PCFdateone23\solution>

How to Import the PCF solution in Dynamics CRM?

Now Go to the folder which you have created and go to the path there the solution folder will be visible open the solution folder and take the path.

Import the Solution to the CRM:

Open the CRM , Click on gear icon find advance settings , click on advance settings , click on settings savron , click on customization area and click on solutions sub area and click on import.

Now Select the folder and import the solution into CRM.

Now Open CRM and go to the customized entity and open main form and create a field with name DateofBirth the save and publish .
then double click on the field and it will navigate to Field Properties and click on controls
By clicking on Add Control , we can see