How to link a action from a controller in Backend ui

Support How do I ...?
#1

Hi folks,

i have to manage some objects from the backend ui. This is the first contact with the backend ui and ExtJs. So first i created a bundle “SubscriptionManagementBundle” and added a Custom Navigation in the startup.js like in the documentation. Got a SubscriptionController in the bundle, in these case with a listAction. In the routing.yml i got this:

_subscription_management:
resource: “@SubscriptionManagementBundle/Controller/”
type: annotation
prefix: /admin/subscriptionmanagement

pimcore_backend_admin-subscription_list:
path: /list
defaults: { _controller: SubscriptionManagementBundle:Subscription:list }

I am studying the customer-management-framework-bundle for a while, but its kind of unclear to me as a beginner. I will check it now again…

How does the routing work, how do I link the controller and actions in the startup.js menu?

Does anyone have a short explanation, an approach or a link for a description of how to use a bundle in the backend, that would help me a lot.

Thanks in advance

#2

Hello.
This is probably old and no longer relevant, but this forum really needs some answers.

I’m no expert, so not sure what’s the best practice here, but I’ve been calling the controllers with ajax. You can check if the controllers work by trying to visit yourdomain/admin/subscriptionmanagement/list
If the controllers are set up right, you now need to call this action from inside JS (which is your main question). I’ve previously done that by means of either a layout button (or toolbar button) with a JS function that calls a function in your startup.js, or, by using some ready-to-use events in ExtJs.

layout button: https://pimcore.com/docs/pimcore/6.7/Development_Documentation/Objects/Object_Classes/Layout_Elements/index.html

toolbar button: https://pimcore.com/docs/pimcore/6.7/Development_Documentation/Best_Practice/Adding_Button_To_Object_Editor.html

extjs events: https://pimcore.com/docs/pimcore/6.7/Development_Documentation/Extending_Pimcore/Bundle_Developers_Guide/Plugin_Backend_UI.html

To call your startup.js function by clicking a layout button, you need something along these lines:
(function () {
SubscriptionManagementBundlePlugin.callMyFancyController(this.object);
})
This calls “callMyFancyController” function from your startup.js, with the argument of that object, so you also get access to all the data you need.

If you add a toolbar button, you already have all the code in startup.js, but you can call a different function from startup.js if you want to spread your code a bit. Like so:
object.toolbar.add({
text : t(‘The button label’),
icon : ‘path/to/icon.svg’, // or iconCls to use class instead
scale : ‘small’,
handler: function (obj) {
SubscriptionManagementBundlePlugin.callMyFancyController(obj);
}.bind(this, object)
});

Anyway, once you got this step out of the way, you need that Ajax call to your controller. Something like this:
callMyFancyController: function (obj){
Ext.Ajax.request({
url : ‘/admin/subscriptionmanagement/list?id=’ + obj.o_id,
async : false,
method : ‘get’,
success: function (response) {
var data = Ext.decode(response.responseText);
console.log(data.success);
}.bind(this)
});
},

Which passes the parameter ‘id’ to the get request. Which you can then collect in the controller.

public function saveAllAction ( Request $request ) {
$id = $request->get(‘id’);
return $this->json(‘success’, “I passed this $id from backend to startup.js to controller and back!”);
}

Hope this helps someone.
Cheers!