Solved

JQuery place view above Workflow Task Approval view?

  • 18 October 2019
  • 3 replies
  • 14 views

Good day all,

I have been trying to figure out how to place a view above the Workflow View in a form (The one that lets you approve or reject or whatever steps have been configured in a workflow task).
There was another post relating to placing views above tabs, which referred to this site: https://k2recipes.wordpress.com/2017/08/29/show-multiple-views-above-tabs-using-script/

utilizing this code 

$($(“.view”)[viewIndex]).insertBefore(“.tabs-top”);

However I have tried different variations of it to apply to the Workflow Task actions. The element has an ID of "WorkflowStrip" so I tried: 

$($(“.view”)[viewIndex]).insertBefore(“#WorkflowStrip”);

But it does not work. Has anyone tried to do this before with any luck? Thank you in advance

icon

Best answer by davidedpg10 21 October 2019, 22:08

View original

3 replies

Userlevel 6
Badge +16

Hi,


 


Would it work if you use form rule for the scenario?


The approval form is composed of 4 views, and one of them is the comments view, which I would like to keep under the WorkflowStrip so that people can add comments, so ideally I would like to keep it up top. There's just one view which is a thin banner view with a company logo and the currently logged in user's name that I would like to still keep above everything, but it's proving to be difficult to achieve.

I have found the solution!!!
I had to play with the Chrome developer console for a bit to stumble upon it. 

<span id='myHeader'></span>
<script>$("#myHeader").closest(".view").addClass("headerView");
workflowStripChild = document.getElementById("WorkflowStrip").firstElementChild;
BannerElement = document.getElementsByClassName("headerView")[0];
workflowView = document.getElementsByClassName("workflow-view")[0];
workflowStripChild.insertBefore(BannerElement,workflowView);
</script>

The code above adds a DIV with ID of "#myHeader" and a Class of "headerView" to the view in which this script is executed, and from that, we create three variables which hold the elements involved in the insertBefore() operation. Then the last line executes and places the view with the class "headerView" above the workflow view.

Reply