rowStyleClassFunc in Power Grid

Classic Servoy
1

Hi Guys,
How exactly are we to use rowStyleClassFunc in Power Grid, specifically where does the grid look for the function? Considering I am using a custom sql query to get my dataset, table calculations are not available. I have tried below just to see what returns, but no luck… I know im missing something here, any help greatly appreciated.

function rowStyle(idx, data, field, value, e) {

application.output(data);
//function (idx, data, field, value, e) { return ‘myStyle’ }).
}

I get this error

angular.js:15567 ReferenceError: rowStyle is not defined
at eval (eval at controller (datasettable.js:232), :1:1)
at controller (datasettable.js:232)
at Object.invoke (angular.js:5141)
at $controllerInit (angular.js:11704)
at nodeLinkFn (angular.js:10517)
at angular.js:10931
at processQueue (angular.js:17945)
at angular.js:17993
at Scope.$digest (angular.js:19112)
at Scope.$apply (angular.js:19500) undefined

2

Hi,

The *Func in Power Grid are string functions evaluated in the Browser by the Power Grid allowing you to customize rows dinamically; the function will have 5 parameters: \

  • the index of the row
  • the whole data in row
  • the grid field
  • the column data
  • the event

check the sample below; a different styleClass is returned depending on the columnData. Note, since the code is running in the browser is not using applicaiton.ouput() for logging but console.log() instead, which will print a log in the Browser console to allow you debugging the data.

(function getStatusColor(rowIndex, rowData, field, columnData, event) {
	console.log(columnData);
	if (!columnData) {
		return "";
	}
	if (columnData) {
		switch (columnData) {
		case "New Order":
			return "label-tag text-info";
			break;
		case "Completed":
			return "label-tag text-success";
			break;
		case "Planned":
			return "label-tag text-info";
			break;
		default:
			break;
		}
	}
	return "label-tag text-info";
})

Regards,
Paolo

3

Thanks Paolo,
One question though, so the function must be typed directly in the rowStyleClassFunc value box, so I cant use a global then pass a reference to it?

4

Hi,

the function must be set as a string indeed, it can’t be a reference to a Servoy function. You can obviously code your function in the script editor and copy paste it in the rowStyleClassFunc property.

Shortly we will release a new version of the svyUtils which contains an handy method for such use cases; since is easier to code it in the script editor and is nice to benefit from the warning and error checker of the developer, will be possible to code the function in script editor as a form function and use a function of our svyUtils module to convert the function into a string you can assign to the rowStyleClassFunc of the Power Grid.

function onLoad(event) {
	var colStatus = elements.table.getColumn('orderStatus');
	if (colStatus) {
		colStatus.cellStyleClassFunc = "(" + scopes.svySystem.printMethodCode(getStatusColor).join("") + ")";
	}
}

function getStatusColor(rowIndex, rowData, field, columnData, event) {
	console.log(columnData);
	if (!columnData) {
		return "";
	}
	
	if (columnData) {
		switch (columnData) {
		case "New Order":
			return "label-tag text-info";
			break;
		case "Completed":
			return "label-tag text-success";
			break;
		case "Planned":
			return "label-tag text-info";
			break;
		default:
			break;
		}
	}
	return "label-tag text-info";
}

Note that will be executed fully in the browser therefore you won’t have access to any Servoy API or object; you can build your logic just using the given parameters.

Regards,
Paolo

5

Ok, that all sounds great, is there a time frame for svyUtils addition ?