I have a query that looks something like this:
Name Total Reports Open Closed In Progress Locked
Mickey 5 3 2
Minnie 4 1 2 1
Is it possible to click on the value in one of the columns and have a process run?
So, if I click on the 5 in the Total Reports column for Mickey a process will run that calls a query that displays all of the reports for Mickey. If I click on the 3 in the Open column it would run a process that runs a query that only shows the 3 open reports.
I am guessing this involves some JavaScript, but not sure what.
Thanks,
Jim
Call process from Query Column Value
Re: Call process from Query Column Value
Yes, I do this all the time but requires some tinkering. You basically need to use the AwareApp JS functions for this and instead of having the value Mickey you would have a HTML element e.g a span like this: `<span title='Explanation to user when hoovering value' onclick='AwareApp.startProcessWithInit('Process','main','TempObject','Value=Mickey');' class='yourspanclass'>Mickey</span>`
You need to have a TempObject BO as a temporary placeholder to hold the value (as the startprocesswithinit creates an instance of an BO with a value, read up on the function in the docs if you don´t understand how it works).
You can then also style the span text so it either looks like the other text in the query or style it in some other way and also add things like cursor so it´s evident to the user they can click on the value. Add a class to a CSS file in your Custom CSS folder for the app, in the example above the classname is "yourspanclass".
I usually use another attribute for the value that only holds the value e.g Mickey and then another attribute that holds the span and the attribute with the span is what I display in the query. I populate the span code etc. via business rules.
You need to have a TempObject BO as a temporary placeholder to hold the value (as the startprocesswithinit creates an instance of an BO with a value, read up on the function in the docs if you don´t understand how it works).
You can then also style the span text so it either looks like the other text in the query or style it in some other way and also add things like cursor so it´s evident to the user they can click on the value. Add a class to a CSS file in your Custom CSS folder for the app, in the example above the classname is "yourspanclass".
I usually use another attribute for the value that only holds the value e.g Mickey and then another attribute that holds the span and the attribute with the span is what I display in the query. I populate the span code etc. via business rules.
Henrik (V8 Developer Ed. - Windows)
Re: Call process from Query Column Value
I have the following JS code in the render script of a query. Notice I have 2 columns I trap double clicks for:
/* ON CLICK FUNCTIONS
$(grid.tbody).on("dblclick", "td", function (e) {
var row = $(this).closest("tr");
var rowIdx = $("tr", grid.tbody).index(row) + 1;
var colIdx = $("td", row).index(this) + 1;
var item = grid.dataItem(row);
var str = item.BAS_REF_VALUE;
var ObjectID = str.replace("OrderLines:", "");
// * IF NOT SHIPPED AND USER CLICKED ON PRICE COLUMN, SHOW EDIT WINDOW
if (colIdx == 9 && item.sc_DateInvoiced == '') // * PRICE COLUMN
AwareApp.startProcess2('ChangeOrderLinePrice', 'OrderLines', ObjectID, 'popup');
// * IF CLICKED ON CPO, SHOW EDIT WINDOW
if (colIdx == 3) // * CPO
AwareApp.startProcess2('ChangePONumber', 'OrderLines', ObjectID, 'popup');
});
/* ON CLICK FUNCTIONS
$(grid.tbody).on("dblclick", "td", function (e) {
var row = $(this).closest("tr");
var rowIdx = $("tr", grid.tbody).index(row) + 1;
var colIdx = $("td", row).index(this) + 1;
var item = grid.dataItem(row);
var str = item.BAS_REF_VALUE;
var ObjectID = str.replace("OrderLines:", "");
// * IF NOT SHIPPED AND USER CLICKED ON PRICE COLUMN, SHOW EDIT WINDOW
if (colIdx == 9 && item.sc_DateInvoiced == '') // * PRICE COLUMN
AwareApp.startProcess2('ChangeOrderLinePrice', 'OrderLines', ObjectID, 'popup');
// * IF CLICKED ON CPO, SHOW EDIT WINDOW
if (colIdx == 3) // * CPO
AwareApp.startProcess2('ChangePONumber', 'OrderLines', ObjectID, 'popup');
});
-
- Posts: 303
- Joined: Wed Apr 22, 2015 11:44 pm
Re: Call process from Query Column Value
Thanks Bruce, that works perfectly.
I did change it from a 'dblclick' to just 'click' and it works just the way I want it.
I did change it from a 'dblclick' to just 'click' and it works just the way I want it.
-
- Posts: 197
- Joined: Fri Jun 17, 2016 7:10 am
- Location: Brisbane Australia
- Contact:
Re: Call process from Query Column Value
You can also use the following Initialization Script in a Query. This updates the Kendo template for the nominated columns. In this case column 0. If you want to update other columns repeat below with a different number in config.columns[0].template.
There is a lot more in the example above that just enabling a clickable column :
Code: Select all
/* Workplace Link */
config.columns[0].template =
` # if (data['Summary']) { #
<span class="usGridLink" style="width:90%;" >
<span onclick="usViewObject('Workplace', '#: ID #' , '#: Summary #', '')" > #: us_ToTitleCase(Summary) # </span>
</span>
# } #`;
- We wrap the column text in our own custom class with <span class="usGridLink" style="width:90%;" > to achieve a particular appearance
- Summary and ID attributes need to be available as columns in the Query.
- usViewObject is our own custom javascript function ...this could be replaced with AwareApp.startProcess2 or other Aware javascript functions.
- us_ToTitleCase is another custom javascript function that converts text to title case. The us_ToTitleCase function returns the updated Summary text (which is stored in UPPERCASE).
- If you change the sequence of the Query columns you need to update the config.columns[0].template number.
AWS Linux, Windows Server, AIM 8.4 & 8.6
-
- Posts: 303
- Joined: Wed Apr 22, 2015 11:44 pm
Re: Call process from Query Column Value
Thanks Union, I will take a look at that.
One thing the client just told, that I didn't even think about, is that the way I am doing it with the render script is causing the cursor to change to an edit type symbol when the mouse is moved directly over the grid cell value.
I am not quite sure what to do about that.
Jim
One thing the client just told, that I didn't even think about, is that the way I am doing it with the render script is causing the cursor to change to an edit type symbol when the mouse is moved directly over the grid cell value.
I am not quite sure what to do about that.
Jim
-
- Posts: 197
- Joined: Fri Jun 17, 2016 7:10 am
- Location: Brisbane Australia
- Contact:
Re: Call process from Query Column Value
In the CSS class “usGridLink” we use in our example we have it makes the hovering cursor display as a hand.
Code: Select all
cursor:pointer;
AWS Linux, Windows Server, AIM 8.4 & 8.6