Question

How to add "Select All" option in Details dropdown

 

Hello Community,

 

I have a requirement to add a "Select all" option in the dropdown of Details Section. I have came across some similar questions on academy but I didn't get the exact solution. Could someone please help with this if they are familiar with this approach or have done this activity previously.

 

 

Regards,

Jagan

Like 2

Like

1 comments

Hello Jagan,

 

You need to add the following methods to your detail schema:

methods: {
			addToolsButtonMenuItems: function(toolsButtonMenu) {
				this.callParent(arguments);
				this.addSelectAndUnSelectAllButton(toolsButtonMenu);
			},
 
			addSelectAndUnSelectAllButton: function(toolsButtonMenu) {
				const isDetailEnabled = this.get("IsEnabled");
				if (isDetailEnabled === false) {
					return;
				}
				const selectAllMenuItem = this.getSelectAllMenuItem();
				if (selectAllMenuItem) {
					toolsButtonMenu.addItem(selectAllMenuItem);
				}
				const unSelectAllMenuItem = this.getUnSelectAllMenuItem();
				if (unSelectAllMenuItem) {
					toolsButtonMenu.addItem(unSelectAllMenuItem);
				}
			},
 
			isSelectAllModeVisible: function() {
				const isMultiSelectVisible = this.isMultiSelectVisible();
				const isSingleSelectVisible = this.isSingleSelectVisible();
				return isMultiSelectVisible || isSingleSelectVisible;
			},
 
			isMultiSelectVisible: function() {
				return !this.get("MultiSelect");
			},
 
			isSingleSelectVisible: function() {
				return this.get("MultiSelect");
			},
 
			isUnSelectVisible: function() {
				return this.isAnySelected();
			},
 
			getUnSelectAllMenuItem: function() {
				return this.getButtonMenuItem({
					"Caption": {"bindTo": "Resources.Strings.UnselectAllButtonCaption"},
					"Click": {"bindTo": "unSelectRecords"},
					"Visible": {"bindTo": "MultiSelect"},
					"Enabled": {"bindTo": "isUnSelectVisible"},
					"IsEnabledForSelectedAll": true
				});
			},
 
			getSelectAllMenuItem: function() {
				return this.getButtonMenuItem({
					"Caption": {"bindTo": "Resources.Strings.SelectAllButtonCaption"},
					"Click": {"bindTo": "setSelectAllMode"},
					"Visible": {"bindTo": "isSelectAllModeVisible"},
					"IsEnabledForSelectedAll": true
				});
			},
		}

and add UnselectAllButtonCaption and SelectAllButtonCaption localizable strings to the schema. Once done the select and deselect all records options will appear in the detail tools

and

Show all comments