is menu > actions still working?

[trungtvmso]

Dear Yuri,

I found out that we can add MenuItem as 'actions' button, but it could not load data-action. I've tried to look for docs or search some sample script but I got nothing else to guide me to use this one. I would like to use this custom button because it's seem clearer than dropdown menu. This is my custom code for the button + its function + what the view rendered:





Also if I want to add more than one of list in dropdown action button like this :

[Follow][DropDownAction1][DropDownAction2]

So how can I do that, can you pls help?

[trungtvmso]

Dear Yuri,

I found out that we can add MenuItem as 'actions' button, but it could not load data-action. I've tried to look for docs or search some sample script but I got nothing else to guide me to use this one. I would like to use this custom button because it's seem clearer than dropdown menu. This is my custom code for the button + its function + what the view rendered:





Also if I want to add more than one of list in dropdown action button like this :

[Follow][DropDownAction1][DropDownAction2]

So how can I do that, can you pls help?

I resolved already the first question. Here is my guide for anyone need to add menu.actions > buttons list into views/entity/detail

Option 1: Directly create menu.actions in detail view by js:
1. Create/Edit custom detail view for your Entity by following this path:

client/custom/src/views/{Entity}/detail.js 

2. Use this Script:

define('custom:views/{Entity}/detail', ['views/detail','views/modal','model'], function (Dep) {
    return Dep.extend({

        setup() {
            Dep.prototype.setup.call(this);

            this.addMenuItem('actions',{
                name: 'buttonName',
                text: this.translate('buttonName', 'labels' , 'Scope'),
                acl: 'read',
                hidden: false,
                style: 'primary',
                action: 'buttonName',
            });            
          
        },

        actionButtonName () {
            console.log('Test action here'); //Can fire anything here

        },

    });
});
​ 

Option 2: Registering menu.actions button from clientDefs

1. Create/Edit clientDefs entity file by following this path:

custom/Espo/Custom/Resources/metadata/clientDefs/{Entity}.json 

2. Use this script in clientDefs file just create/open:

{
    "menu": {
        "detail": {
            "actions": [
                "__APPEND__",
                {
                    "label": "buttonName",
                    "labelTranslation": "Scope.labels.buttonName",
                    "name": "buttonName",
                    "action": "buttonName",
                    "hidden": false,
                    "acl": "read"
                }
            ]
        }
    }
}​ 

Dont forget to register your new label in l18n.



3. Create/Edit custom detail view for your Entity by following the path as same as Option 1.1
Use the script like create handler class right this link: https://docs.espocrm.com/development...#handler-class
But must remember that you are extending entity detail view so that you must define your custom class for detail view, not for custom handler like this:

Right define for extending:

define('custom:views/{Entity}/detail', ['views/detail','views/modal','model'], function (Dep) 

[trungtvmso]

Noted: some other params like iconHtml, html, etc... we might use be like dropdown and buttons register but can not use handler param due to the button uses action function directly define in views/detail.

I hope my sharing can help you guys could do anything helpful

[rabii]

This is the recommended way to do it. https://docs.espocrm.com/development...ist-edit-views

[yuri]

Items by the actions key are no officially supported. Use 'dropdown' key instead.

[trungtvmso]

thank you for your reply, I've just relized that actions key is not having fully function as dropdown (not hide when buttons inside are all in hidden). But if I still want to use that one, can I customize and use it? it would not be effected to other part of view, right?

[yuri]

It's hard to tell. They were added in the very beginning and were never used or maintained since. So I would avoid using it.

[espcrm]

Just want to say, it look like you are doing very neat thing trungtvmso

Hopefully once you polished it or happy with it, you can share.

[trungtvmso]

Just want to say, it look like you are doing very neat thing trungtvmso

Hopefully once you polished it or happy with it, you can share.

Sure bro, I will share everything I've been learnt or found out when trying to customize my Espo. I'm planning to use this actions menu for a scenario that:

if screen width >= 768px >>>>> all the buttons will be defined in buttons type.
if screen width < 768px >>>>> all the buttons will be definded in this actions button instead of dropdown menu due to we are currently having one more dropdown menu at the left side (beside Edit button of every record view)

[Kharg]

I was able to make it work in a rather hacky way.
Yuri, please don't hate me