custom button | Community Creatio

17:43 Dec 10, 2024

Hello,
In order to add a button to a mobile page you need to modify the viewConfigDiff element. In your code it is missing, so you should add it manually in the "settings" element:

{
&nbsp; &nbsp; "operation": "insert",
&nbsp; &nbsp; "name": "settings",
&nbsp; &nbsp; "values": {
&nbsp; &nbsp; &nbsp; &nbsp; ---
&nbsp; &nbsp; &nbsp; &nbsp; "viewConfigDiff": "[]"
&nbsp; &nbsp; }
}

Here is an example of adding a new tab to the page:

"viewConfigDiff": "[{\"operation\":\"insert\",\"name\":\"LeadDecisionsPaths_Tab\",\"parentName\":\"Lead_Tabs\",\"propertyName\":\"items\",\"values\":{\"position\":2,\"text\":\"DecisionsPaths_Caption\",\"body\":{}}}]"

The button should be added similarly.

Place button at dashboard section

17:04 Jan 21, 2025

Jimmy Meijon,

You can find an instruction on how to add a button and its logic in this article.

Show all comments

Andrii Herbshtasov

15:50 Oct 01, 2024

Hi! How to place a button at dashboard section ? I know there is an article
https://academy.creatio.com/docs/developer/interface_elements/record_page/button/overview
but there is no information about dashboard section containers.

3 comments

Malika

22:47 Oct 07, 2024

Hello,

You can use this instruction: https://academy.creatio.com/docs/developer/interface_elements/record_page/button/overview to add the necessary button to any section. If you have a Freedom UI, you can use the Button component for dashboards using this article: https://academy.creatio.com/docs/8.x/no-code-customization/customization-tools/ui-and-business-logic-customization/UI-designer#title-2230-17.

Andrii Herbshtasov

09:28 Oct 08, 2024

Malika,

as I said in the post, this article does not answer my question, there is no container for the dashboard section

Anhelina

20:02 Oct 11, 2024

Andrii Herbshtasov,

Unfortunately, there is no way to implement the button in the dashboard section.

As a workaround you can create a custom page in FreedomUI by no-code methods and add a Button with all needed dashboards.

Show all comments

Hiding custom button for active record in detail based on some condition of record's field

Shaurydeep Saxena

10:26 Sep 17, 2024

diff: /**SCHEMA_DIFF*/[
{

"operation": "merge",
"name": "DataGrid",
"values": {
"activeRowAction": {bindTo: "onActiveRowAction"},
"activeRowActions": [
{
"className": "Terrasoft.Button",
"style":this.Terrasoft.controls.ButtonEnums.style.BLUE,
"markerValue": "myButtonAction",
"tag": "myAction",
"caption": "View image",
"enabled": false,
"visible":{bindTo: "IsButtonVisible"},

}
],
// "visible": {"bindTo": "isButtonVisible"},

}
}
]/**SCHEMA_DIFF*/,
        methods: {
isButtonVisible: function()
{
console.log("hello");
const activerow= this.get("ActiveRow");
if(activerow)
{

var msg= this.getActiveRow().get("UsrMessage") ;
if(msg==="hello"){return false;}

}
return true;

}
}
    };

I tried adding button, and when giving visible:true, it is working fine, now i want to hide that button from some records of detail based on some condition so i bind it with the function, but it is not working, the function is not getting called/executed, when i am doing it at grid level then it is working fine, but not working on button, is there something am i missing or doing wrong, i even tried it using attribute and setting it's value in the function

3 comments

18:08 Sep 17, 2024

I've never been successful with binding values in ActiveRowActions to attributes to change them after render. They don't seem to have the same bindings as other view model elements do. The only way I've been able to get this to work is to modify the dom elements on row select to manipulate, which is a bit hacky. Alternatively, just add logic to the button click to validate if the action can be performed or not, which isn't ideal either.

Ryan

Shaurydeep Saxena

18:14 Sep 26, 2024

Ryan Farley,

Can you please elaborate on modifying dom elements, how can i do that, because that's the only option i can see too

Solem Khn

17:46 May 13, 2025

Shaurydeep Saxena,

try checking this code in GridUtilities

switchActiveRowActions: function() {
            const grid = this.getCurrentGrid();
            if (!grid) {
                return;
            }
            const activeRowActions = grid.activeRowActions;
            if (activeRowActions) {
                const schemaActiveRowActions = this.get("ActiveRowActions");
                if (!schemaActiveRowActions) {
                    this.set("ActiveRowActions", activeRowActions);
                }
            }
            if (this.get("IsCardVisible") === true) {
                grid.activeRowActions = [];
            } else {
                grid.activeRowActions = this.get("ActiveRowActions");
            }
        },

Show all comments

detail

Custom Details

Sales_Creatio_enterprise_edition

7.18

Add conditional button into the active row of detail

Cristopher Montgomery

18:18 Jul 16, 2024

Hi all,

Further to the thread below, is it possible to make a button added to the active row of a detail conditional?
Add button into the active row of detail | Community Creatio

I want to make the button enabled on a certain condition but when I add the enabled and visible values to the Diff of the datagrid, I get no result (tried passing "enabled": false to check it wasn't an issue with the CanSplitFlights method)

define("UsrFlightsDetail", ["ProcessModuleUtilities"], function(ProcessModuleUtilities) {
	return {
		entitySchemaName: "UsrFlights",
		details: /**SCHEMA_DETAILS*/{}/**SCHEMA_DETAILS*/,
		diff: /**SCHEMA_DIFF*/[
			{
				"operation": "merge",
				"name": "DataGrid",
				"parentName": "Detail",
				"propertyName": "items",
				"values": {
					"activeRowActions": [],
					"activeRowAction": {"bindTo": "onActiveRowAction"}
				}
			},
			{
				"operation": "insert",
				"name": "DataGridActiveRowSplitFlights",
				"parentName": "DataGrid",
				"propertyName": "activeRowActions",
				"values": {
					"className": "Terrasoft.Button",
					"style": Terrasoft.controls.ButtonEnums.style.BLUE,
					"caption": "Split flights",
					"tag": "SplitFlights",
					"visible": true,
					"enabled": CanSplitFlights
				}
			}
		]/**SCHEMA_DIFF*/,
		methods: {
            CanSplitFlights: function() {
                var FlightTypeId = this.getActiveRow().get("UsrFlightType");
				var FlightTypeValue =  FlightTypeId  && FlightTypeId.value;
 
				if (FlightTypeValue == '3a0d3b1b-9af5-472a-bac9-e785500ac4e9') {
					return true;
                }
                return false;
            },
			onActiveRowAction: function(SplitFlights) {
				switch (SplitFlights) {
					case "SplitFlights":
						this.onSplitFlights();
						break;
					default:
						break;
				}
			},
			onSplitFlights: function(){
				ProcessModuleUtilities.executeProcess({
					sysProcessName: "UsrSplitFlights",
					parameters: {
						FlightId: this.getActiveRow().get("Id")
					}
				});
			},

2 comments

Best reply

20:09 Jul 16, 2024

I've done some hacky options that sort of worked manipulating the button elements in the dom on row click, but I've never been able to have it work binding an attribute to the visible/enabled of the row buttons and change row by row. That's never worked for me. Instead I typically do a check in the code that executes on click to let the user know if it's not available for the row. I'd love to know if there's some way for this to work, but from experience it doesn't work.

Add button in the standard list (say Contacts List)

20:09 Jul 16, 2024

Cristopher Montgomery

11:50 Jul 17, 2024

Ryan Farley,

Thanks Ryan. I'll call it quits then and add a check on click.

Honestly, it's more of an aesthetic requirement than a functional one. Ideally I won't offer the user a button that they can't click.

Show all comments

08:52 Jun 27, 2024

Hi Everyone,

I need to add button in the standard list (say Contacts). On click of this button, I want to call custom web service function. Is there a way I can do that. Is there any alternative available for the same.

Thanks,
Manoj

6 comments

Yevhenii Grytsiuk

19:03 Jun 27, 2024

Hello Manoj,
Thank you for your question.

There is an article available on the Academy that covers this topic with an example.

Regarding following question: "Is there any alternative available for the same".

It depends on what you mean here. You can call a web service from different parts of an application. For example, you can make a business process that makes a call to a web service (link).

Hope this helps, let me know if you have any question left.

06:48 Jun 28, 2024

Yevhenii Grytsiuk,

Hi Yevhenii,

Apologies if my previous message was unclear. I want to add a button to each row in the native list, specifically as a column, and trigger a web service call when this button is clicked to sync data from another system.

For example, I need to add a sync icon as a column in the Project List. When the sync button for Project 1 is clicked, it should call the web service to sync data related to Project 1 from another system. Similarly, clicking the sync button for Project 2 should sync data related to Project 2, and so on.

I hope this clarifies my request. Thank you!

20:36 Jun 28, 2024

Manoj Patil,

You can add the following to the diff of the section:

{
	"operation": "insert",
	"name": "DataGridActiveRowSyncButton",
	"parentName": "DataGrid",
	"propertyName": "activeRowActions",
	"values": {
		"className": "Terrasoft.Button",
		"style": "green",
		"tag": "sync",
		"caption": "Sync"
	}
}

This will add the button. Then for handling the click, add this to the methods:

onActiveRowAction: function(buttonTag, primaryColumnValue) {
	this.callParent(arguments);
 
	if (buttonTag === "sync") {
		// do your stuff here
		// primaryColumnValue is the row's Id value
 
		// you can get other values from the row using
		var row = this.getActiveRow()
		var val = row.get("UsrSomeColumn");
	}
}

Ryan

07:50 Jul 01, 2024

Ryan Farley,

Hi Ryan,

Thank you for the details.

This section is created via Section Wizard and it correctly appears in Application Hub. However, I do not a find a place where this code needs to be added. Please guide me on the same as I am unsure if I am missing anything here.

19:07 Jul 01, 2024

The Section wizard creates two client schema files. One ending in "Page" and one ending in "Schema". The one ending in "Schema" is the one you want to add this code to. To see these files you need to look at the contents of the package containing your customizations, either by opening Advanced Settings from your application in App Hub or using the Advanced Settings link in the System designer.

Ryan

Change and save record by custom button

07:10 Jul 03, 2024

Ryan Farley,

I am unable to locate the System Designer icon on the Project List Page. See below screengrab.

I went to Advanced Settings and didn't find the schema files ending with "Page" and others ending with "Schema". See below screengrab.

Therefore, I navigated to Application Hub, Navigation Sections, and Selected Project which opened Projects: Section.

In the Section Pages, I selected Edit Page which opened the Section Wizard screen with Tabs Pages, Business Rules, and Source Code at the top of the screen.

I clicked on the Source Code tab and pasted the code at this place but it didn't reflect the new button in the list.

I am unsure why the System Designer icon does not appear on the Project List screen. (Could it be a Creatio Version Issue? I am using Version 8.1.3.6734)
Why schema files ending with "Page" and "Schema" are not available in the Advanced Settings. (Could it be a Creatio Version Issue? I am using Version 8.1.3.6734)
I assume I am placing the code on the Project Detail page and not on the Project List Page.

Show all comments

Andrii Herbshtasov

09:49 Apr 15, 2024

Hi!

I need a custom button that will change value in a recaord and then save this record. I've tried it on a OpportunitySectionV2 with this code

define("OpportunitySectionV2", [], function() {
	return {
		entitySchemaName: "Opportunity",
		details: /**SCHEMA_DETAILS*/{}/**SCHEMA_DETAILS*/,
		diff: /**SCHEMA_DIFF*/[ 
            {
                "operation": "insert",
                "parentName": "ActionButtonsContainer",
                "propertyName": "items",
                "name": "MainContactSectionButton",
                "values": {
                    itemType: Terrasoft.ViewItemType.BUTTON,
                    caption: { bindTo: "Resources.Strings.OpenPrimaryContactButtonCaption" },
                    click: { bindTo: "onOpenPrimaryContactClick" },
                    "layout": {
                        "column": 1,
                        "row": 6,
                        "colSpan": 1
                    }
                }
            }]/**SCHEMA_DIFF*/,
		methods: {
			prepareResponseCollectionItem: function(item) {
				this.callParent(arguments);
         		if (item.get("MgtImportantFlg") === false){
					item.customStyle = Ext.apply({}, {
					  "background-color": "#cc081c",
					  "font-family": "cursive"
					}, item.customStyle);		  		
		  		}
			},
			onOpenPrimaryContactClick: function(){
				var activeRow = this.get("ActiveRow");
				var bFlag = this.get("GridData").get(activeRow).get("MgtImportantFlg");
					if(bFlag){
						this.get("GridData").get(activeRow).set("MgtImportantFlg",false);
						this.save();
					}
					else{
						this.get("GridData").get(activeRow).set("MgtImportantFlg",true);
						this.save();
					}
			}
		}
	};
});

it change the value in my field but didn`t save it, so after reload shows old value.

Could anyone help me how should i change code for my purposes?

1 comments

Best reply

11:37 Apr 16, 2024

Hello,

In the section module, it is better to use an UpdateQuery class to change the value of the records. You can find the example here.

11:37 Apr 16, 2024

Hello,

In the section module, it is better to use an UpdateQuery class to change the value of the records. You can find the example here.

Show all comments

Button

Business Process

Sales_Creatio_team_edition

8.0

Start the process by clicking the button

Oleg Drab

15:31 Apr 09, 2024

Hi,

I have created a button in ActivitySectionV2.
This button appears on all entries in this section.

But when you click on this button, nothing happens.
Please let me know how to fix the error.

Code:

define("ActivitySectionV2", ["ProcessModuleUtilities"], function (ProcessModuleUtilities) {
  return {
    entitySchemaName: "Activity",
    details: /**SCHEMA_DETAILS*/ {} /**SCHEMA_DETAILS*/,
    diff: /**SCHEMA_DIFF*/ [{
      "operation": "insert",
      "parentName": "DataGrid",
      "propertyName": "activeRowActions",
      "name": "runProcessButtonOpenOpportunity",
      "values": {
        "className": "Terrasoft.Button",
        /*"itemType": Terrasoft.ViewItemType.BUTTON,*/
        "caption": "Відкрити угоду",
       "click": {
          bindTo: "runProcessButtonOpenOpportunity"
        },
        "style": Terrasoft.controls.ButtonEnums.style.GREEN
      }
    }] /**SCHEMA_DIFF*/,
    methods: {
      runProcessButtonOpenOpportunity: function () {
        var activeRowId = this.get("Id");
        var args = {
          sysProcessName: "UsrProcessOpenOpportunityInActivity",
          parameters: {
            OppID: activeRowId
          }
        };
        ProcessModuleUtilities.executeProcess(args);
      }
    },
    rules: {}
  };
});

Error:

File attachments

photo_2024-04-09_15-20-30.jpg

photo_2024-04-09_15-08-19.jpg

1 comments

17:49 Apr 22, 2024

Hello,
If you want to add a button to an action menu for the active row, the regular approach will result in the error you received.
Here you can find an example of how to configure such a button properly.

Show all comments

Sales_Creatio_enterprise_edition

HideButton

7.18

Adding a conditional button to the left container

Cristopher Montgomery

13:36 Mar 07, 2024

Hi all,

I've added a button to the left container of the orders page labelled 'Update quote costs'. The button is visible on the condition that the boolean 'Recalculation required' (a field on the order) is true. I've added the diff and the method to the section schema and the section page.

(edit - added gif of button)

When I open the page from the section for a record where 'Recalculation required' is true, the button does not appear. If I refresh the page, the button then does.

I believe this is because the header loads before the data so when it first loads, it can't read the 'Recalculation required' field.

Is there a solution to this? If not, I can move the button to the header container as the conditions do work this way. It just doesn't look as good.

Nb. using Freedom shell on classic pages

1 comments

Add a custom button - Mobile Application

17:58 Mar 21, 2024

Hello,

The problem is not in the container, when you open a page from a section, the system still thinks that you see a section page. Therefore, the condition for your button isn't applied.

In order to fix it, you need to create your button in a combined mode, for example.

Take a look at the button and its condition is defined in a SectionV2 page as well as PageV2.

Show all comments

Ramya R

12:48 Nov 15, 2023

Hi everyone,

I am trying to add a custom button to the contacts section in the mobile application. I followed the steps provided in: https://community.creatio.com/articles/adding-custom-user-action-mobile… to create a custom button on the user actions list, but I was unsuccessful.

Alternatively, is there a way to add buttons to the section (list) page, or to add a button in the Freedom UI section of the mobile application?

Regards,

Ramya

3 comments

Oleg Drobina

12:47 Nov 16, 2023

Hi Ramya,

Currently there is no way to add custom buttons in Freedom UI (the article you refer to will only work in classic UI). I've created a suggestion for our R&D team to make it possible to add buttons in Freedom UI using no-code capabilities and pointed them to your community question.

Thank you for helping us in making the app better!

Ramya R

13:10 Nov 16, 2023

Hi Oleg Drobina,

Thank you for the prompt response. In the Classic UI, is it possible to add a button somewhere other than the record's edit page, maybe in the section page or a common menu like the settings? Or is it possible to override the existing 'Add Contact' button?

Regards,

Ramya

Pranshu Basak

09:00 Dec 02, 2024

Oleg Drobina,

Hello, Oleg
I find it a little difficult to figure out how to implement the freedom ui component configuration in my page, even if Creatio documentation lists it all: https://academy.creatio.com/docs/8.x/dev/development-on-creatio-platfor…;

The "UsrMobileUsrLeaveRequestRecordPageSettingsWorkplace2" client module is attached to this mobile page for a custom section that I designed called "UsrLeaveRequest."
How do I proceed about adding a custom button to this edit page now?

[
   {
       "operation": "insert",
       "name": "settings",
       "values": {
           "entitySchemaName": "UsrLeaveRequest",
           "details": [],
           "columnSets": [],
           "localizableStrings": {
               "SocialMessageDetailCaptionUsrLeaveRequest_caption": "Feed",
               "AttachmentsDetailCaptionUsrLeaveRequest_caption": "Attachments",
               "primaryColumnSetUsrLeaveRequest_caption": "General information",
               "UsrEmployeV2_DetailStandardDetailUsrLeaveRequest_caption": "Employees detail"
           },
           "settingsType": "RecordPage",
           "operation": "insert",
 
       }
   },
   {
       "operation": "insert",
       "name": "SocialMessageDetailV2StandardDetail",
       "values": {
           "caption": "SocialMessageDetailCaptionUsrLeaveRequest_caption",
           "entitySchemaName": "SocialMessage",
           "showForVisibleModule": true,
           "filter": {
               "detailColumn": "EntityId",
               "masterColumn": "Id"
           },
           "operation": "insert"
       },
       "parentName": "settings",
       "propertyName": "details",
       "index": 0
   },
   {
       "operation": "insert",
       "name": "AttachmentsFlutterDetailStandardDetail",
       "values": {
           "caption": "AttachmentsDetailCaptionUsrLeaveRequest_caption",
           "entitySchemaName": "SysFile",
           "filter": {
               "detailColumn": "RecordId",
               "masterColumn": "Id"
           },
           "operation": "insert"
       },
       "parentName": "settings",
       "propertyName": "details",
       "index": 1
   },
   {
       "operation": "insert",
       "name": "UsrEmployeV2_DetailStandardDetail",
       "values": {
           "caption": "UsrEmployeV2_DetailStandardDetailUsrLeaveRequest_caption",
           "entitySchemaName": "Employee",
           "filter": {
               "detailColumn": "Manager",
               "masterColumn": "UsrApplicant"
           },
           "detailSchemaName": "UsrEmployeV2_Detail",
           "operation": "insert"
       },
       "parentName": "settings",
       "propertyName": "details",
       "index": 2
   },
   {
       "operation": "insert",
       "name": "primaryColumnSet",
       "values": {
           "items": [],
           "rows": 1,
           "entitySchemaName": "UsrLeaveRequest",
           "caption": "primaryColumnSetUsrLeaveRequest_caption",
           "position": 0,
           "operation": "insert"
       },
       "parentName": "settings",
       "propertyName": "columnSets",
       "index": 0
   },
   {
       "operation": "insert",
       "name": "42d4b33c-f361-44d4-92cd-07e8db664fca",
       "values": {
           "row": 0,
           "content": "Leave Request No.",
           "columnName": "UsrLeaveReaquestNo",
           "dataValueType": 1,
           "operation": "insert"
       },
       "parentName": "primaryColumnSet",
       "propertyName": "items",
       "index": 0
   },
   {
       "operation": "insert",
       "name": "0d5ca981-1558-4e4d-b1a2-2b2b9dbd422c",
       "values": {
           "row": 1,
           "content": "End Date",
           "columnName": "UsrEndDate",
           "dataValueType": 8,
           "operation": "insert"
       },
       "parentName": "primaryColumnSet",
       "propertyName": "items",
       "index": 1
   },
   {
       "operation": "insert",
       "name": "2013f978-c87f-4896-96be-5383cfd044e3",
       "values": {
           "row": 2,
           "content": "Start Date",
           "columnName": "UsrStartDate",
           "dataValueType": 8,
           "operation": "insert"
       },
       "parentName": "primaryColumnSet",
       "propertyName": "items",
       "index": 2
   },
   {
       "operation": "insert",
       "name": "266417d3-f847-4386-af45-2674e9e779bb",
       "values": {
           "row": 3,
           "content": "Applicant",
           "columnName": "UsrApplicant",
           "dataValueType": 10,
           "operation": "insert"
       },
       "parentName": "primaryColumnSet",
       "propertyName": "items",
       "index": 3
   },
   {
       "operation": "insert",
       "name": "1655829d-ce75-476c-9350-ce2696ecbf6d",
       "values": {
           "row": 5,
           "content": "Reason",
           "columnName": "UsrReason",
           "dataValueType": 1,
           "operation": "insert"
       },
       "parentName": "primaryColumnSet",
       "propertyName": "items",
       "index": 4
   },
   {
       "operation": "insert",
       "name": "9f677f71-3322-4e75-9938-69ca4e1c650f",
       "values": {
           "row": 6,
           "content": "Status",
           "columnName": "UsrStatus",
           "dataValueType": 10,
           "operation": "insert"
       },
       "parentName": "primaryColumnSet",
       "propertyName": "items",
       "index": 5
   },
   {
       "operation": "insert",
       "name": "3d874029-b467-4d7b-9eb0-d2ebfbe20403",
       "values": {
           "row": 7,
           "content": "Working Days Count",
           "columnName": "UsrWorkingDaysCount",
           "dataValueType": 4,
           "operation": "insert"
       },
       "parentName": "primaryColumnSet",
       "propertyName": "items",
       "index": 6
   },
   {
       "operation": "insert",
       "name": "bc0d7d7e-ffdf-44a5-98b3-0a10094341e2",
       "values": {
           "row": 4,
           "content": "Applicant.Manager",
           "columnName": "UsrApplicant.Manager",
           "dataValueType": 10,
           "operation": "insert"
       },
       "parentName": "primaryColumnSet",
       "propertyName": "items",
       "index": 7
   }
]

Show all comments