kick off process from button in custom dashboards

It is useful practice in almost every process application to trigger process instance from requester dashboard using button,

one of the way to do it by using coach view:

    Step 1:  Design a coach view and name it as 'Start Request Button', design a layout as show in fig.

var button = this.context.element.getElementsByTagName("button")[0];
interestingly above script will give you button object, where you can capture the click event later.

button.onclick = function() {
var icon = document.querySelector('.busy-icon');
icon.setAttribute("class", "busy-icon active");

HTML DOM querySelector() Method. Get the first element in the document with class="busy-icon": set the busy-icon active css class,
the purpose of this active busy-icon will show until the request is full filled. lets come this later part of the code.


require(["dojo/store/JsonRest"], function(JsonRest) {
var store = new JsonRest({
target: "../rest/bpm/wle/v1/"
});
store.get("exposed/process").then(function(data) {
console.log("data = ", data);
if (data && data.status == "200" && data.data) {
data = data.data;
for (var i = 0; i < data.exposedItemsList.length; ++i) { var process = data.exposedItemsList[i]; if (process.type == "process" && process.processAppAcronym == "XXXXX" && process.display == "XXXXXXXXXX" && (process.isDefault || process.tip) ) {

dojo/store/JsonRest is a lightweight object store implementation of an HTTP-based (RFC 2616) client with RESTful data interaction capabilities. This store implements the dojo/store. for detail information about this operation you can visit link dojo/store/JsonRest

process Acronym and process Display are the key indicators on exposed process item object to identify the process application that you want to trigger


console.log("process.startURL = ", process.startURL);
var relativeURL = process.startURL.substr(process.startURL.indexOf("/rest/bpm/wle/v1/") + 17);
console.log("relativeURL = ", relativeURL);
store.put({}, {
id: relativeURL,
incremental: true
}).then(function(data) {
console.log("data = ", data);
if (data && data.status == "200" && data.data) {
data = data.data;
var taskId = data.tasks[data.tasks.length - 1].tkiid;
var bpdInstanceId = data.piid;
/*
var clientType = data.tasks[data.tasks.length-1].clientTypes[0];
store.get("task/" + taskId + "/clientSettings/" + clientType).then(function(data){
console.log("task details data = ", data);
if(data && data.status == "200" && data.data){
data = data.data;
document.location.replace(data.url);
}
});
*/
window.location = "../ProcessPortal/dashboards/TWP/BPM_WORK?tw.local.view=taskcompletion&tw.local.taskid=" + taskId;
}
});
break;

The primary objective of this code is to get the relative url of the process and by using http protocol PUT method to create process instance and corresponding task id. that you can see in javascript promise block.

Once you get instance and task id then by using GET method to retrieve the url replace the url by using replace method of document location object. so overall build the window.location which already open the task for a corresponding instance in portal.

We will learn another way of doing the same thing in next post, thanks for your time 🙂

Overall code looks like below


// this.context.element.getElementsByTagName("button")[0].onclick = this.createRequest;
var button = this.context.element.getElementsByTagName("button")[0];
var serverName = this.context.options.serverName.get("value");

button.onclick = function() {
//alert("serverName"+serverName);
var icon = document.querySelector('.busy-icon');
icon.setAttribute("class", "busy-icon active");
require(["dojo/store/JsonRest"], function(JsonRest) {
var store = new JsonRest({
target: "../rest/bpm/wle/v1/"
});
store.get("exposed/process").then(function(data) {
console.log("data = ", data);
if (data && data.status == "200" && data.data) {
data = data.data;
for (var i = 0; i < data.exposedItemsList.length; ++i) { var process = data.exposedItemsList[i]; if (process.type == "process" && process.processAppAcronym == "XXXXX" && process.display == "XXXXXXXXXXXXXX" && (process.isDefault || process.tip) ) { var trackName = ""; //alert("--->"+serverName);
if(serverName == "RUNTIMEINSTANCE")
{
trackName = "Main";
}else{
trackName = process.branchName;
}
if(trackName == "Main"){
console.log("process.startURL = ", process.startURL);
var relativeURL = process.startURL.substr(process.startURL.indexOf("/rest/bpm/wle/v1/") + 17);
console.log("relativeURL = ", relativeURL);
store.put({}, {
id: relativeURL,
incremental: true
}).then(function(data) {
console.log("data = ", data);
if (data && data.status == "200" && data.data) {
data = data.data;
var taskId = data.tasks[data.tasks.length - 1].tkiid;
var bpdInstanceId = data.piid;
/*
var clientType = data.tasks[data.tasks.length-1].clientTypes[0];
store.get("task/" + taskId + "/clientSettings/" + clientType).then(function(data){
console.log("task details data = ", data);
if(data && data.status == "200" && data.data){
data = data.data;
document.location.replace(data.url);
}
});
*/
window.location = "../ProcessPortal/dashboards/TWP/BPM_WORK?tw.local.view=taskcompletion&tw.local.taskid=" + taskId;
}
});
break;
//alert("window.location-->"+window.location);
}
}
}
}
});
});

}

0 thoughts on “kick off process from button in custom dashboards

  1. Quentintroft Reply

    Your comment is awaiting moderation.

    Nicely put, With thanks.
    http://canadianonlinepharmacynnm.com/
    top rated online canadian pharmacies northwest pharmacy cheap prescription drugs online canadian pharmacies online
    <a href="http://en.liimapuu.fi/albumi/liimapuuvalmistusjamateriaali/1488243?m=+++Awesome+material,+Thanks%21+++https://nicktambone.com/+++medical+information+online+%3Ca+href=%22http://www.canadianpharmacymsn.com/%22%3Eonline+pharmacies+canada%3C/a%3E+approved+canadian+pharmacies+online+mexican+pharmacies+shipping+to+usa+++%3Ca+href=%22http://brainomaniac.com/?p=1&unapproved=6243&moderation-hash=5d8a9a13f202a508a0ef12b100035936#comment-6243%22%3Edrugs+online%3C/a%3E+++%3Ca+href=%22http://grunger.net/2017/07/13/instagram-digest-20170713/instagram-digest-20170713-10/comment-page-1/?unapproved=48221&moderation-hash=1c903e73141a63808b38f59b6aed7d52#comment-48221%22%3Emexican+pharmacy+online+medications%3C/a%3E+++%3Ca+href=%22http://www.michaelhancock.co.uk/who-knew-jim-carrey-was-so-knowing/?unapproved=31625&moderation-hash=27845bb1fd359f9f24edf97714b815e4#comment-31625%22%3Eprescription+drugs+canada%3C/a%3E+++%3Ca+href=%22http://solviturambulando.com.pt/blog/2016/04/10/citacao-1/?unapproved=17624&moderation-hash=012590b65550d68182eda76e9a0b5075#comment-17624%22%3Edrugstore+online%3C/a%3E+++%3Ca+href=%22http://www.sanalyus.com/vbulletin-r10-yeni-temasi.html#comment-9135%22%3Ecanadian+meds%3C/a%3E+++%3Ca+href=%22http://avisekphotography.com/beas-manali/?unapproved=65838&moderation-hash=fcbbff30d49ebb8c7d35b7f5de8b2cf0#comment-65838%22%3Edrug+costs%3C/a%3E&s=Quentinplupt&err=captcha#album_comment”>pharmacy tech
    prescription online
    canada pharmacies online pharmacy
    prescription drug assistance
    rx online
    online pharmacy reviews

Leave a Reply

Your email address will not be published. Required fields are marked *