Enable Action Dropdown with Custom Buttons Only (No Default Buttons)

[ThomasMrln]

Feature Request: Enable Action Dropdown with Custom Buttons Only (No Default Buttons)

Is your feature request related to a problem? Please describe.

Currently, when using the action buttons dropdown functionality in Backpack's operation lists, it's not possible to have a dropdown containing only custom buttons without displaying any of the default buttons (show/edit/delete).

The current implementation seems to require at least one default button to be visible to enable the dropdown functionality, which limits customization flexibility when we want to provide entirely custom actions.

Describe the solution you'd like

I would like the ability to:

• Enable the action buttons dropdown functionality
• Add only custom buttons to the dropdown
• Hide all default buttons (show, edit, delete)
• Still maintain the dropdown UI/UX behavior

Example use case:

// In ListOperation
$this->crud->enableActionsDropdown();
$this->crud->addButtonFromView('line', 'custom_action_1', 'custom_action_1', 'end');
$this->crud->addButtonFromView('line', 'custom_action_2', 'custom_action_2', 'end');
$this->crud->addButtonFromView('line', 'custom_action_3', 'custom_action_3', 'end');
$this->crud->addButtonFromView('line', 'custom_action_4', 'custom_action_4', 'end');

// Hide all default buttons but keep dropdown functionality
$this->crud->removeButton('show');
$this->crud->removeButton('edit');
$this->crud->removeButton('delete');

[backpack-ai-bot[bot]]

Yes, you can enable the action buttons dropdown in Backpack and have it display only your custom buttons, with all default buttons (show, edit, delete) removed. The dropdown UI/UX is not tied to the presence of default buttons—it is controlled by the lineButtonsAsDropdown setting, which applies to all buttons in the line stack, whether default or custom.

Here’s how you can achieve your desired setup:

1. Enable the dropdown for line buttons in your List operation:

   CRUD::setOperationSetting('lineButtonsAsDropdown', true);

   You can also control when the dropdown appears using lineButtonsAsDropdownMinimum and lineButtonsAsDropdownShowBefore if needed.

2. Add your custom buttons to the line stack:

   CRUD::addButtonFromView('line', 'custom_action_1', 'custom_action_1', 'end');
   CRUD::addButtonFromView('line', 'custom_action_2', 'custom_action_2', 'end');
   CRUD::addButtonFromView('line', 'custom_action_3', 'custom_action_3', 'end');
   CRUD::addButtonFromView('line', 'custom_action_4', 'custom_action_4', 'end');

3. Remove the default buttons:

   CRUD::removeButton('show');
   CRUD::removeButton('edit');
   CRUD::removeButton('delete');

This will result in only your custom buttons being present in the dropdown. The dropdown functionality is not dependent on the presence of default buttons; it simply groups whatever buttons are present in the line stack into a dropdown, according to your configuration.

References:

• The dropdown is enabled via the lineButtonsAsDropdown setting, and applies to all buttons in the line stack, not just default ones. You can control its behavior and thresholds as needed. List Operation: Merging line buttons into a dropdown
• You can freely add and remove buttons from the line stack using the Buttons API. Buttons API

There is no mention in the knowledge sources of a requirement for default buttons to be present for the dropdown to work. If you encounter issues, ensure you are using the correct Backpack version and that your custom buttons are properly added to the line stack.

ℹ️ Please note our AI Bot does not reply to follow-ups, this will be the only AI answer in this thread. If the AI helped you find the answer, please mark it as answered or write details below so it can learn. Then close the conversation. If not, please give more information for when a human reads this. ℹ️

Relevant sources:

Save Actions|Save Actions API
[Show] - Action buttons dropdown
Github Issue (closed): [Feature Request] Ability for buttons to load global JS
Github Issue (closed): Custom buttons
Github Issue (closed): [Feature Request] Allow hiding the button texts, so that buttons only show icons
Buttons|Buttons
Github Issue (closed): [V6] Use dropdown for actions column on List operation
Feature Request
Github Issue (closed): [Bug] If i give denyAccess to update and delete but still Action column is available without button
Github Issue (closed): [Feature] hide actions buttons for specific row in backpack list operations
Github Issue (closed): Hide Action row
List Operation|Merging line buttons into a dropdown
[4.1][Feature][Ready] Implement dynamic save actions

[ThomasMrln]

---

Update: Attempted Solution Still Not Working

I tried implementing the suggested approach using the lineButtonsAsDropdown settings, but unfortunately it's still not working as expected.

Here's my current implementation:

public function setup()
{
    CRUD::setModel(VehicleInstance::class);
    CRUD::setRoute(config('backpack.base.route_prefix') . '/vehicle');
    CRUD::setEntityNameStrings('vehicle', 'vehicles');

    $this->crud->denyAccess(['create', 'delete']);

    /**
     * Configuration pour convertir les boutons en dropdown
     */
    $this->crud->operation('list', function () {
        $this->crud->enableBulkActions();

        // Activer la conversion automatique des boutons en dropdown
        CRUD::setOperationSetting('lineButtonsAsDropdown', true);
        CRUD::setOperationSetting('lineButtonsAsDropdownMinimum', 0);

        // Ajouter les boutons individuels qui seront automatiquement convertis en dropdown
        
        // Bouton "Modifier" personnalisé
        CRUD::button('update_custom')->stack('line')->view('crud::buttons.link_button')->meta([
            'access' => 'update',
            'label' => trans('backpack::crud.edit'),
            'icon' => 'la la-edit',
            'icon_size' => 'la-lg',
            'color' => 'text-primary',
            'title' => trans('backpack::crud.edit'),
            'url' => function ($entry, $crud) {
                return url($crud->route . '/' . $entry->getKey() . '/edit');
            }
        ]);

        // Bouton "Voir le véhicule"
        CRUD::button('vehicle_show')->stack('line')->view('crud::buttons.link_button')->meta([
            'access' => true,
            'label' => 'Voir le véhicule',
            'icon' => 'la la-external-link',
            'icon_size' => 'la-lg',
            'color' => 'text-success',
            'target' => '_blank',
            'title' => 'Voir le véhicule sur le site',
            'divider_after' => true,
            'url' => function ($entry, $crud) {
                return $entry->url;
            }
        ]);

        // Bouton "Imprimer la fiche"
        CRUD::button('printAttach')->stack('line')->view('crud::buttons.link_button')->meta([
            'access' => 'show',
            'label' => 'Imprimer la fiche',
            'icon' => 'la la-print',
            'icon_size' => 'la-lg',
            'color' => 'text-info',
            'target' => '_blank',
            'title' => 'Imprimer la fiche véhicule',
            'url' => function ($entry, $crud) {
                return url($crud->route . '/' . $entry->getKey() . '/print-attach');
            }
        ]);

        // Bouton "Force-reload"
        CRUD::button('printAttachForce')->stack('line')->view('crud::buttons.link_button')->meta([
            'access' => 'show',
            'label' => 'Force-reload',
            'icon' => 'la la-sync',
            'icon_size' => 'la-lg',
            'color' => 'text-warning',
            'target' => '_blank',
            'title' => 'Imprimer la fiche véhicule (forcer le rechargement)',
            'url' => function ($entry, $crud) {
                return url($crud->route . '/' . $entry->getKey() . '/print-attach?force=true');
            }
        ]);

        $this->crud->addButtonFromView('bottom', 'bulk_printAttach', 'vehicles.printing.bulkPrintAttach', 'beginning');

        // Supprimer tous les boutons par défaut
        $this->crud->removeButton('delete');
        $this->crud->removeButton('update');
        $this->crud->removeButton('show');
    });
}