Advertisements

Control Add-In in Business Central

Today I will discuss about how we can create control add-in using VS Code & Extensions in Business Central.

We can create a control add-in the same way we created pages or code units.  In Visual Studio we can use the code snippet T control add-in to generate a new control add-in.

It will better to create a fresh Extension Project in VS Code for control add in.

Step – 1 : Preparation

Create a New project, and add Folder Structure to arrange your files.

You can find steps in this post : Bare Minimum Steps to Start with fresh Extension Project for Business Central

I will create below Folder:

  1. ControlAddIn
  2. Images
  3. JsScript
  4. Page
  5. StyleSheet

Step – 2 : Create Control Add-In

In control add-in folder I’m going to create a new control add-in.  So new file.

addin-1

Use the snippet, T control add-in, to create a control add-in.

addin-2

Give the name to your control add-in in my example I have used “WeatherControlAddIn

A control add-in works with JavaScript files that can execute some code.  The scripts property is used to reference these JavaScript files.  They can be local files or references to external files over http or HTTPS.  A very commonly used JavaScript library is jQuery.  JQuery makes it a lot easier to write JavaScript code and it reduces the lines of code significantly. In our case any such files will be saved in JsScripts folder under Extension-> Objects Folder as setup above. One file we will create for StartupScript as Start.js.

Now let’s include jQuery.  We have to download jQuery from the Internet.  So if we open our Web browser and we go to the jQuery website, we can click the download jQuery button over here.  But instead of really downloading the jQuery files, we are going to reference them online.

Open the site: https://jquery.com/

addin-3

Click on Download jQuery v3.3.1 large button as shown above.
Scroll down to find: – Microsoft CDN (Content Delivery Network)
Microsoft also has a CDN for jQuery. We take that one.
Copy the link to the latest one. Add this to our Scripts property in our control add-in.

https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.js”

Use the URL of jQuery file. There’s also a property start-up script which you can use to call a special script that runs when the page where you have implemented your control add-in is loaded.  Now let’s add our start.js script over here.  So because it’s in the folder script, we have to “Objects/JsScripts/Start.js”.  Now, there’s also a recreate and a refresh script.  We are not going to use them in this demo project, so remove them. And with the images and the style sheets properties you can specify additional style to the control add-in.

Scripts = ‘https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.js’;

StyleSheets = ‘Objects/StyleSheet/StyleSheet.css’;
StartupScript = ‘Objects/JsScripts/Start.js’;
Images = ‘Objects/Images/Weather.jpg” />

I am using dummy image to display on my control add-in, select your image accordingly and place it in Images folder.
We will look into StyleSheet.css and Start.js later in below post.

addin-4

This is how your WeatherControlAddIn.al should look like.

Step – 3 : Create Style Sheet

I will be adding a CSS file to this with the name StyleSheet.css.  In this CSS file I can apply some layout styles to give my control add-in a color or let it choose a certain font and so on and so on.  But remember there are some guidelines on which styles to apply.  I’m going to set my image to a width 200 pixels.  So in CSS, this is image.  Width, 200 pixels, and a margin top of 25 pixels.  And then I need to reference it in my style sheet properties.  This is ‘Objects/StyleSheet/StyleSheet.css’ and of course in the folder StyleSheet.

addin-5

You can apply your knowledge about stylesheets to decorate your add-in accordingly, for demo purpose I have just set the width and top margin of the image.

Similarly I have downloaded an image from internet related to weather and copied to Images Folder.

Now set the path of both the files in your control add-in as shown above.

Step – 4 : Create CardPart Page

Now, our control add-in will run in a CardPart.  So we have to create a page.  Let’s create a new file and call this WeatherCardPart.al.  This is a page.  So T page.  Let’s give it an ID and a name.  WeatherCardPart.  Now the source table will be customer.  And the page type is CardPart.

Your Page should look similar to below:

addin-6

We have added our ControlAddIn on the CardPart.

Next we will pass data from our Navision to the JQuery Script to process, to do so we have added a local procedure GetCustomer, remember above in control add-in we added signature of this procedure. Now it’s time to implement that function.

We have created a JsonObject to store our data and pass to Control Add-In.

This function gets called from OnAfterGetRecord trigger of the Page.

You may be wondering about function call QueryTempOfCity, this is the same function which we used in our earlier post to call API and get temperature of specified city then updated the Headline of the RC Page.

If you missed you can find that post here: Working with Headline Role Center Page and HTTP Call – Business Central

I have copied some functions from that post and changed a little bit and added to this page, it should be like below:

addin-7

This function will take City as parameter and query from API and return the current temperature of that city. This function is explained in referenced post above.

Step – 5 : Create Page Extension

CardPart runs in a factbox on a page.  So let’s create a page extension on the customer card.  So new page.  Let’s call this customercardextension.al. which extends the customer card.  Add a factbox in the factboxes, and this is a part — let’s give it a name.  WeatherCardPart.  And this is of type WeatherCardPart.  When adding a part or a factbox, then need to set the sub page link.  So don’t forget to set the sub page link and this is equal to the number equals field number.

addin-8

It should be similar to above.

Step – 6 : Create jQuery Script

Here comes the most interesting and difficult part as we are not regular Java Script programmer, but thanks to google, who is always there to help.

We will create our Start.js

You can apply your Java Scripts skill to enhance this, let us keep it simple for learning purpose.

We will extract the information send via GetCustomer function in JsonObject and display in our Control Add-In.

addin-9

You can say controlAddIn here as main outer container.

We have defined 4 sub containers and with unique id to reference further.

Now we add all this 4 sub-containers to the main container controlAddIn.

Get the values from the Navision CardPard GetCustomer function and decode the JsonObject Customer and extract value from it and assign to these 3 containers.

For 4th we have assigned the image path from Extension using special function Microsoft.Dynamics.NAV.GetImageResource

Step – 7 : Deploy and Test the Control Add-In

So now we are done with Creating of Control Add-In, deploy your extension by using command pallet, Publish you Extension.

Open the Customer Card and you should see your Control Add-In in action.

addin-10

addin-11

Tested successful. Here we come to the end of our today’s post.

Hope you liked and enjoyed learning the concept in this post.

Will come up with more such interesting concepts in my future posts.

Till then keep exploring and learning. Take Care of yourself.

Advertisements

AccessByPermission Property – in Navision 2015

Sets a value for a table field or UI element that determines the permission mask for an object that a user must have to see and access the related page fields or UI element in the client. The UI element will be removed at runtime if the user does not have permissions to a certain object as specified in the Access by Permission window.

AccessByPermission-1
AccessByPermission-2
AccessByPermission-3

Depending on the setting in the UI Elements Removal field in the Microsoft Dynamics NAV Server Administration tool, only user interface (UI) elements on objects in the license or on objects that the user has permissions to will appear in the user interface.

AccessByPermission-4

To make full use of the LicenseFileAndUserPermissions option in the UI Elements Removal field, it is recommended that you assign the special permission set, FOUNDATION, along with the relevant permission sets that define which application objects the user will access.

AccessByPermission-5

The majority of the permission sets that are provided with the CRONUS demonstration database cannot be combined with the FOUNDATION permission set to fully use the UI Elements Removal feature. You must first create or edit the relevant permission sets to avoid that the user is blocked from performing the involved tasks. You must first create or edit the relevant permission sets to avoid that the user is blocked from performing the involved tasks.

If you only use the LicenseFile option in the UI Elements Removal field, then you do not have to edit any permission sets as they will not affect which UI elements are removed.

To specify when UI elements are removed
  1. Open the Microsoft Dynamics NAV Server Administration
  2. In the UI Elements Removal field, choose the relevant option as described in the following table.
Option Description
None All UI elements are displayed, even if the license file does not include the related object and the user does not have permissions to the related object.
LicenseFile A UI element is removed if the related object is not included in the license file.
LicenseFileAndUserPermissions A UI element is removed if the related object is not included in the license file and the user does not have permissions to the object as defined in the AccessByPermission property for the related UI element.

By default, this option is selected.

AccessByPermission-6

When you configure user interfaces in Microsoft Dynamics NAV, you should make sure that the UI Elements Removal field is set to its default, LicenseFileAndUserPermissions, so that you only see the relevant UI elements in the Customize window.

When you develop in Microsoft Dynamics NAV, you should make sure that the UI Elements Removal field is set to its default, None, to make sure that all UI elements are visible when you review your development in the UI.

All types of UI elements will be removed if they relate to objects that are not included in the license or the user does not have the required permission to the objects:

  • Fields
  • Actions
  • Page parts

UI elements that are directly related to an object through the TableRelation or the CalcFormula property can be removed automatically according to the license file and/or user permissions.

For UI elements that are not directly related to an object, you can use the AccessByPermission property to remove the element according to the user’s permission to a related object

All types of UI elements will be removed if they relate to an object to which the user does not have the required permissions:

Fields on pages, including FactBoxes

Actions on pages, including toolbars and navigation panes

Page parts, such as Lines FastTabs

Note

To use this property, the UI Elements Removal field in the Microsoft Dynamics NAV Server Administration tool must be set to LicenseFile or LicenseFileAndUserPermissions.

This Property Applies To

Fields in tables (affecting all related fields on pages)

Fields on pages

Actions on pages

MenuSuite items

Page parts, such as a Lines FastTab

Property Value

When you choose the AssistEdit button, the Access By Permission window opens. Fill the fields as described in the following table.

Field Description
Object Type Specify the type of object to which permission is required to display the UI element.
Object ID Specify the object to which permission is required to display the UI element.
Read Specify if Read permission is required to display the UI element.
or Insert Specify if Insert permission is required to display the UI element.
or Modify Specify if Modify permission is required to display the UI element.
or Delete Specify if Delete permission is required to display the UI element.
or Execute Specify if Execute permission is required to display the UI element.

AccessByPermission-7

Note

If multiple permissions are selected, then one or the other applies.

Example: Remove the Unit Price field if the user does not have permission to the Sales Price table

Open table 27, Item Card, with the Table Designer.

View the properties of field 18, Unit Price.

For the AccessByPermission property, choose the AssistEdit button in the Value field.

In the Access By Permission window, fill the fields as described in the following table.

Field Description
Object Type TableData
Object ID Sales Price
Read Select
Insert Select
Modify Leave blank
Delete Leave blank
Execute Leave blank

Close the Access By Permission window and save the changes on table 27.

All instances of the Unit Price field on pages are now removed if the user does have Read or Insert permission to the Sales Price table.

AccessByPermission-8

Important

If you defined the property for a table field, then all instances of the field on pages are removed. To override the property on an individual page field, delete the permission value after the = sign in the Value field. Do NOT delete the whole string as that will be replicated on the property of the table field.

Note

To use the LicenseFileAndUserPermissions option in the UI Elements Removal field, you must assign the special FOUNDATION permission set to the user along with the relevant application permission sets that define which application objects the user will access. Unlike the BASIC permission set, the FOUNDATION permission set only grants access to application setup and system tables and requires that other assigned permission sets define which specific application objects can be accessed.

Not all of the 167 default permission sets that are provided with Microsoft Dynamics NAV are ready to support the FOUNDATION permission set to remove UI elements according to user permissions. You must therefore edit the relevant permission sets as explained in the following procedures.

To experience how UI elements are removed for a user performing the task to create and edit a new customer, you can create a sample user interface based on default permission sets provided with Microsoft Dynamics NAV.

Special Permission Sets

The following permission sets have special definitions that you should be aware of as you implement permissions and security for Microsoft Dynamics NAV users.

Permission set Definition
SUPER Can read, use, update, and delete all data and all application objects in the scope of your license. Microsoft Dynamics NAV requires that at least one user be assigned this permission set in each database.

You cannot modify permissions for the SUPER permission set.

SUPER (DATA) Can read, use, update, and delete all data. You typically assign this permission set to an accounting manager who needs to work with all data but does not need to change Microsoft Dynamics NAV.

This permission set does not give access to the Object Designer.

SECURITY Can create new users and assign them the same permission sets. Must be able to access the User, User Property, Permission Set, and Access Control tables.

For example, you can create a SECURITY permission set that includes the four required tables and any additional permissions that you want to include. You can then assign this permission set to a user who is a department administrator. This user can then administer permissions for other users in their department.

Only a user who has the SUPER permission set can create and modify a SECURITY permission set. Users who have this permission set can assign the same permissions to other users, but they cannot assign themselves the SUPER permission set.

BASIC Grants Read access to almost all application tables and all system tables.

The main purpose of this permission set is to enable the client to open and show all pages.

When you create a new database, you must import the BASIC permission set from an XML file.

FOUNDATION A prerequisite for all other permission sets. The FOUNDATION permission set grants access to system tables and application setup tables that are required for most application features to work.

Note

This permission set is recommended when using the UI Elements Removal feature to automatically remove UI elements according to user permissions.

Important

Most of the contents you find in this blog will be either inherited from MSDN or Navision Developer IT Pro Help. Some places images are also directly taken from these sites. Purpose is simple to try those stuffs and re-produce adding few things as per my understanding to make easy understanding for others and quick reference.

Here nothing under my own brand or authorship of the content. At any point of time we are just promoting Microsoft stuffs nothing personnel with same.

Hope stuffs used here will not violate any copyright agreement with them. In case by mistake or in-intestinally it happens and the Microsoft feels these should not be used Microsoft have full right to inform me about same and will be glad to take down any such content which may be violating the norms.

Purpose is to promote Navision and share with community.

FB Profile

Like FB Page

%d bloggers like this: