How to manually render workflow transition buttons?

Hi everyone!

Yesterday i faced a problem. I have an entity template. In this template i render a list of some related entities.
For each of these entities i want to render available workflow transition buttons.

I do it like that:

{% for stage in entity.stages %} <div class="well"> {{ ui.renderProperty('some_translation'|trans, stage.name) }} {{ oro_widget_render({ 'widgetType': 'block', 'url': path('oro_workflow_widget_buttons', {entityClass: stageEntityClass, entityId:stage.id}), }) }} </div> {% endfor %}

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

{% for stage in entity.stages %}   <div class="well"> {{ ui.renderProperty('some_translation'|trans, stage.name) }} {{ oro_widget_render({ 'widgetType': 'block', 'url': path('oro_workflow_widget_buttons', {entityClass: stageEntityClass, entityId:stage.id}),         }) }}     </div>   {% endfor %}

So, buttons renders successfully. But when i click to any transition button – im redirected to corresponding workflow api url. And entity workflowStep is not changed.
If i open this entity in separate template (where the transition buttons rendered in the head of the page, by default) – all transition handled correctly.

So, how to render these buttons in any place and make em work?
Thanks!

---

Docker environment for Symfony2/OroCRM/OroBAP development on Windows platform
https://github.com/stepansib/sf-oro-docker

Topic

[Mike KudelyaParticipant]

Hi,

The easies approach is wrap oro_widget_render into

XHTML

<div class="page-title">

1	<div class="page-title">

[Stepan YudinParticipant]

Hi, Mike.

Thank you, that works! Maybe you can help me with ‘workflow_widget_steps’ rendering too?
Im trying to render this widget for every child entity, but it renders in the page header (not in specified template div and overrides parent entity’s steps widget)

{{ oro_widget_render({ 'widgetType': 'block', 'url': path('workflow_widget_steps', {entityClass: oro_class_name(stage), entityId:stage.id}), 'alias':'stage_steps' }) }}

1 2 3 4 5 6 7

{{ oro_widget_render({     'widgetType': 'block',     'url': path('workflow_widget_steps', {entityClass: oro_class_name(stage), entityId:stage.id}),     'alias':'stage_steps' }) }}

---

Docker environment for Symfony2/OroCRM/OroBAP development on Windows platform
https://github.com/stepansib/sf-oro-docker

[Mike KudelyaParticipant]

I have made example for you, of course it needed to some modifications and checks, but it works. Put this code to your view page:

XHTML

<div class="page-title"> {{ oro_widget_render({ 'widgetType': 'block', 'url': path('oro_workflow_widget_buttons', { entityClass: 'OroCRM\\Bundle\\SalesBundle\\Entity\\Opportunity', entityId: 6 }), 'alias': 'workflow_buttons' }) }} {{ oro_widget_render({ 'widgetType': 'block', 'url': path('oro_workflow_widget_steps', { entityClass: 'OroCRM\\Bundle\\SalesBundle\\Entity\\Opportunity', entityId: 6 }), 'alias':'stage_steps' }) }} <div class="workflow-steps-placeholder6"></div> <script type="text/javascript"> require(['oroui/js/mediator', 'ready!app'], function(mediator) { mediator.trigger('workflowSteps:render', 6); }); </script> </div>

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

<div class="page-title">                 {{                 oro_widget_render({                     'widgetType': 'block',                     'url': path('oro_workflow_widget_buttons', {                         entityClass: 'OroCRM\\Bundle\\SalesBundle\\Entity\\Opportunity',                         entityId: 6                     }),                     'alias': 'workflow_buttons'                 })                 }}                   {{ oro_widget_render({                     'widgetType': 'block',                     'url': path('oro_workflow_widget_steps', {                         entityClass: 'OroCRM\\Bundle\\SalesBundle\\Entity\\Opportunity',                         entityId: 6                     }),                     'alias':'stage_steps'                 }) }}                 <div class="workflow-steps-placeholder6"></div>                 <script type="text/javascript">                     require(['oroui/js/mediator', 'ready!app'],                             function(mediator) {                                 mediator.trigger('workflowSteps:render', 6);                     });                 </script>         </div>

and replace this file with following code:

XHTML

define(function(require) { 'use strict'; var BaseModel = require('oroui/js/app/models/base/model'); var BaseController = require('oroui/js/app/controllers/base/controller'); var mediator = require('oroui/js/mediator'); var workflowStepsModel = new BaseModel(); var stepPlaceholderPrefix; mediator.setHandler('workflowSteps:update', function(data, placeholderPrefix) { workflowStepsModel.set(data); stepPlaceholderPrefix = placeholderPrefix; }); mediator.on('page:update', function() { workflowStepsModel.set({ steps: [], currentStep: false }); }); mediator.on('workflowSteps:render', function (stepPlaceholderPrefix) { var WorkflowStepView = require('oroworkflow/js/app/views/page-element/workflow-steps-view'); new WorkflowStepView({ model: workflowStepsModel, el: '.workflow-steps-placeholder' + stepPlaceholderPrefix, autoRender: true }); }); /** * Init layout's handlers and listeners */ BaseController.loadBeforeAction([ 'oroworkflow/js/app/views/page-element/workflow-steps-view' ], function(WorkflowStepView) { BaseController.addToReuse('workflowSteps', WorkflowStepView, { model: workflowStepsModel, el: '.workflow-steps-placeholder', autoRender: true }); }); });

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43

define(function(require) {     'use strict';       var BaseModel = require('oroui/js/app/models/base/model');     var BaseController = require('oroui/js/app/controllers/base/controller');     var mediator = require('oroui/js/mediator');     var workflowStepsModel = new BaseModel();     var stepPlaceholderPrefix;       mediator.setHandler('workflowSteps:update', function(data, placeholderPrefix) {         workflowStepsModel.set(data);         stepPlaceholderPrefix = placeholderPrefix;     });       mediator.on('page:update', function() {         workflowStepsModel.set({             steps: [],             currentStep: false         });     });       mediator.on('workflowSteps:render', function (stepPlaceholderPrefix) {         var WorkflowStepView = require('oroworkflow/js/app/views/page-element/workflow-steps-view');         new WorkflowStepView({             model: workflowStepsModel,             el: '.workflow-steps-placeholder' + stepPlaceholderPrefix,             autoRender: true         });     });       /**      * Init layout's handlers and listeners      */     BaseController.loadBeforeAction([         'oroworkflow/js/app/views/page-element/workflow-steps-view'     ], function(WorkflowStepView) {         BaseController.addToReuse('workflowSteps', WorkflowStepView, {             model: workflowStepsModel,             el: '.workflow-steps-placeholder',             autoRender: true         });     }); });

[Stepan YudinParticipant]

Thank you Mike, you saved me)
Im not so familiar with JS but i understand your modifications to widget placeholder
Many many thanks to you man!

---

Docker environment for Symfony2/OroCRM/OroBAP development on Windows platform
https://github.com/stepansib/sf-oro-docker

[Bhavesh TailorParticipant]

Hello Mike ,

I am trying to merge sales and opportunity process . I did created on save opportunity sales process automatically created with work and step id . now i want to add workflow transition button on opportunity view page .

Thank You in advance .

---

Bhavesh

[Mike KudelyaParticipant]

Hi

You can add buttons via ‘/workflowdefinition’ page or just add/modify workflow by adding it to config. See workflow examples.

[Author]

Replies