Implement JavaScript in ModelDriven Apps / MSCRM

 

Introduction:

In this blog we will see how to write JavaScript in Model Driven Apps and MSCRM

Events:

    1. On Load Event

    2. On Save Event

    3. On Change Event

Steps to Follow

    a. To Proceed With First Navigate to https://make.powerapps.com

    b. Then Navigate to Table where you want to write JavaScript

    c. Then Click On Form --> Open the main form

     d. then Click on Events and Click Add Library

    e. If you have already Web Resource Available you can select the WebResource if not select New WebResource

 

    f. Then it will open a form there you can enter the WebResource Name then type as JSCRIPT and Click Text Editor then you can input your JAVASCIPRT for the Event 

    e. Once the WebResource Selected you can See the Event Hander Button will get Enabled

    g. You can see the Event Handler click On OnLoad (Event Handler) to Process with On Load Event then On Save(Event Handler) for On Save Operation once added the funciton Name Click ok

    

    h. then we can See the Event Gets Added 

FOR ONCHANGE OPERATION:

    a. Click on the Field in the Form to Proceess with On Change Operation

    b. Here you can see the Events with On Change Operation 

    

    c. Click On Event Handler and Add the On Change Function name in Function Text Box

Then Click on Done 

Save and then Publish

That's It. 

Now if you Open the Screen then You can see the OnLoad(when page Gets Loaded),OnChange(When a Field Gets Changed), OnSave(When a Page gets Saved)

For Script/Demo Solution you can refer to this github

 

Show or Hide Command Bar using JavaScript in DataVerse/ Dynamics 365

 

Introduction:

In this Blog we will see how to show or hide Command bar using JavaScript in Both Dataverse/Model Driven Apps/ CRM

Below is the Sample Screen Shot for Command bar

If we want to hide any button or edit command we can use RIBBON Workbench or Customize Using XML. But there is no other functionality for hiding whole Command Bar.

To recover from this Situation Microsoft introduced a new Feature for Show or Hide functionality

Script to Use:

formContext.ui.headerSection.setCommandBarVisible(BOOLEAN);

To Utilize in script

function showOrHideCommandBar(executionContext)

{

var formContext = executionContext.getFromContext();

formContext.ui.headerSection.setCommandBarVisible(false); // True to enable // False to hidden

}

That's it :)

Step by Step Guidence Calculated Field and Rollup Fields in DataVerse

Introduction:

In this Blog we will see how to Use Calculated Field and Rollup Fields in Dataverse Environment.

Calculated Field:

We can use calculated Field for doing multiple operations like (Add/Subtract/multiple) etc.,.

Example Process Steps:

1. Navigate to https://make.powerapps.com

2. Click Solutions

3. Create a Solutions and Add Create an Entity or Add an Existing Entity

4. Consider Entity name (Calculate Table)

5. Open Calculate Table --> Add Column and Create three Fields --> Select Data Type as Whole Number

6. Create a new Field in the same table and Select Data Type as Whole Number and Select Calculated or Rollup as Calculation and Click Done

7. Once save Done Open the Field Again the click Open Calculation

8. Once Page gets opened (write the script in Action Column)

9. Once Done click Tick Symbol and Save the Record 

You can see the Values calculated as per our expectations

POINTS TO BE NOTED

If you leave the Value as NULL then the calculate value wont work. if you want to make it work write a business rule / Javascript to set it to Zero if value is Blank

RollUp Field:

We can use Rollup Field to Rollup Values from Child to Parent Record(SUM/Count/AVG/Min/Max)

Example Process Steps:

1. Navigate to https://make.powerapps.com

2. Click Solutions

3. Create a Solutions and Add Create an Entity or Add an Existing Entity

4. Consider Entity name (Opportunity)

5. Create a Field in the Opportunity (Lookup to Account and Total Amount Field)

6. In the Account Entity Create a Field With type as Whole Number and Select Calculate or Rollup fiel d to ROLLUP based on below Image

7. Once field Created open the field

8. As per the screen shot mentioned Click Open Rollup and Select the Related Entity and User the Aggregate Operation (here Am taking Sum of Total Value from Opportunity)

9. Save and Close and publish it.

Conclusion:

Hope you can able to understand technically how to use Calculated and Rollup Fields. Drop me a comment if you have any queries

github for Sample Solution

Subscribe

Command Designer with PowerFx

 Introduction:

In this Blog we will see preview feature of PowerApps for Command Designer

Steps to Follow:

1. If you have Environment available go to https://make.powerapps.com else Create Trail and navigate to https://make.powerapps.com

2. Then Create a model driven app 

3. Once Model Driven app created change to URL to https://make.preview.powerapps.com

4. Navigate to Solutions and open the solution which you have created based on step 2

5. Open solution Opened Click on Apps then select the three Dots of your Model Driven apps then Click Edit and select Edit in Preview

6. Once Page Opened click on the Entities the Edit Command bar(Preview)

7. As it is a preview we cannot edit Out-of-the Box Buttons

8. To Create a new Button click on New Command

9. To change Icon

Select the Icon as Use Icon and select the Icon So that you can see the icon displayed at the Button Level

10. To trigger Action 

Select the Run Formula if you want to user PowerFX like Patch etc

Patch(Contacts,Self.Selected.Item,{'Enable Button':'Enable Button (Contacts)'.Yes})

If you want to update some data in the Record you can use above function         (here Enable Button is a two option Field)

11. To Run JavaScript

Change Action to Run JavaScript and provide the Library and function (add Parameter if needed)

12. To enable and Disable function

Set Visibility to Show on Condition from formula

In the Visible property i written function as if the field is No display else don't display

Self.Selected.Item.'Enable Button'='Enable Button (Contacts)'.No

13. Then you can SaveAndPublish

14. Run to see the changes

15. if you want to see these components

Click on Component Library and Click on the Library inside the Grid to see the components.

Github for more commands

Subscribe

Powerapps with Bing Maps

 Introduction:

In this Post we will see how to user Powerapps with Bing Maps

1. Login to https://make.poweapps.com

2. Click Apps --> select New --> Select Canvas --> Select Tablet Mode

3. Add two Labels and Name like Follows

       a. "Latitude" & Location.Latitude

       b. "Longitude" & Location.Longitude

4. Go to Bing Maps Dev Center - Bing Maps Dev Center (bingmapsportal.com)

5. Click Sign In

6. Enter the Respective Details

7. Once the Account Created --> Go to My Account -->Select Keys

8. Expand show Key and Copy the Key

9. Navigate to Powerapps again ---> Select DataSource --> Select Add Data select  Bings Maps--> Paste the Key and click Done

10. Once Connected--> Add Image field in the Gallery

        a. in the Image Column BingMaps.GetMap("Road",15,Location.Latitude,Location.Longitude)

11. Once you provided you can see the map gets loaded

12. Once Done to add a Dynamic Values

13. Create 3 Text Box for Street,Country and PostalCode then three lables for the same

        a. then Add a Button and in onselect of button write this code     Set(getLocationByAddress,BingMaps.GetLocationByAddress({addressLine:TextInput1.Text,adminDistrict:TextInput1_1.Text,postalCode:TextInput1_2.Text}))

14. Then in the Label --> 2 new Lables

        "Latitude" & getLocationByAddress.point.coordinates.latitude

        "Longitude" & getLocationByAddress.point.coordinates.longitude

15. Once we click on Button the 14(labels will auto populate

16. Then select the Map and write below code

BingMaps.GetMap("Road",15,getLocationByAddress.point.coordinates.latitude,getLocationByAddress.point.coordinates.longitude,{pushpin:getLocationByAddress.point.coordinates.latitude&","&getLocationByAddress.point.coordinates.longitude&";21;"& TextInput1.Text})

"Road" --> Road View

15 --> Zoom Level

getLocationByAddress.point.coordinates.latitude --> Latitude

getLocationByAddress.point.coordinates.longitude --> Longitude

PushPin{} --> for Showing push pin with Comma separator with Latitude and Longitude

21--> Map with Pushpin number

TextInput1.Text --> To display address

GitHub Link for your reference

Add Image control in Dataverse or CRM Templates

 Navigate to https://make.powerapps.com

Navigate to Solutions

Create a Solution by Providing Required Details

Click Save

Then If you want to Create a new Table click App then select Table and Provide Required Information

Else

Click on Add Existing then Select the Existing Table

Open the Created/Existing Table

Then Create an Image File by clicking on Add Column

Click Save

Now go to Forms --> Add the Field into the Form

 

Once Added the template in the Form click Save then Publish

Now Click on Back

Then Navigate to Data Create a New record and Add an Image File

Once the Record gets Created

Navigate to Advance Settings --> By clicking on Gear Icon at the top then Select Template
    

 

Select the Templates and Click New

Select Word Template and select Entity (based on the entity which you have added into the solution), then click on select Entity. System will Generate a File

Open the File then Click on Develop at the top then click on XML Mapping Pane

then Select the last option in Custom XML Part

once selected click expand then select the Logical name of image which we have created

Right Click on Image then select Insert Content Control Then Click Picture

Once the Picture Added save the File (Demo For Document Template)

Then navigate to Dataverse/CRM System then go to template in settings à Select Upload template and Upload the Filed which we have saved.

Once Done. Open the Contact Record which we have created

Click three dots then select Demo For Document Template click on the file to download

Once download done open the file

 

 Youtube Link for your reference

Subscribe

How to Patch Choice Field and lookup in Sharepoint Powerapps

 Hello All,

Usually in Sharepoint for patching Text field we can easily patch it to Powerapps

but for Creating/Updating the Choice/Lookup field we need to use different way to Update the same. 

Please find the below Code to Patch choice field and Lookup Field in PowerApps

To Patch Choice Field

Patch('Sharepoint List Name',

   Defaults('Sharepoint List Name'),

{choice:

 {'@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",

   Id:1,

  Value:"Enter Choice #2"} // Approved

 }

)

 

To Patch lookup Field

 

Patch('Sharepoint List Name',

         Defaults('Sharepoint List Name'),

        {Lookup:{'@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",

                        Id:'ID OF THE RECORD',//Gallery1.Selected.ID

                        Value:'Value of the Record'}//Gallery1.Selected.Title

              }

         )