Conditional formatting within a repeater control

Post any questions you have about using the Verj.io Studio, including client and server-side programming with Javascript or FPL, and integration with databases, web services etc.

Moderators: Jon, Steve, Ian, Dave

Dave
Ebase Staff
Posts: 89
Joined: Mon Sep 10, 2007 11:48 am

Conditional formatting within a repeater control

#1

Postby Dave » Fri Jan 04, 2013 1:54 pm

I have a table of data that I want to layout using a repeater control. The layout needs to vary though depending on the values in the particular table row being laid out. The kinds of thing I need to do are to hide or show table data, hide or show controls within the repeater row, set properties of other controls within the repeater row, and so on. How can I do this? On the face of it there doesn’t seem to be any sort of event that would allow me to get at the repeater rows as they're processed, and nor does there appear to be a repeater object that I could loop through and change the values or properties of the controls that it contains.
0 x

Dave
Ebase Staff
Posts: 89
Joined: Mon Sep 10, 2007 11:48 am

Conditional formatting within a repeater control

#2

Postby Dave » Fri Jan 04, 2013 2:03 pm

In fact this is very easily done. There’s a couple of key things to understand though: firstly, you have to know that a repeater row will automatically hold the state of all of the controls defined within it, and secondly, you have to know that when you link a table to a repeater control you also create a logical equivalence between the table’s rows and the repeater’s rows. This means that you can quite literally loop through the table’s rows and make property changes to any of the controls contained within the repeater row controls that they’re linked to…and Xi will automatically maintain the state for each repeater row.

A simple example: you have a repeater control which is linked to a table called A and contains a panel called P. Let’s say table A has one column called COLOUR and what we want to do is give the panel a background colour that matches the value in the COLOUR column. To do this we simply need to loop through the table and set the background colour of the panel P before Xi presents a page to the screen. For example, the script below running on the Before Form event would do the trick:

Code: Select all

importPackage(com.ebasetech.xi.api);
importPackage(com.ebasetech.xi.services);

// set up some data
//
tables.A.insertRow();
tables.A.COLOUR.value='RED';
tables.A.insertRow();
tables.A.COLOUR.value='GREEN';
tables.A.insertRow();
tables.A.COLOUR.value='BLUE';
tables.A.insertRow();
tables.A.COLOUR.value='YELLOW';
tables.A.insertRow();
tables.A.COLOUR.value='GRAY';

// set the panel P background colour
//
var rows=tables.A.rows;
while (rows.next()){
   controls.P.backgroundColor=tables.A.COLOUR.value;
}
You can download a simple form that implements this example from
http://www.ebaseftp.com/download/forum/rpdemo.zip
0 x


Who is online

Users browsing this forum: No registered users and 38 guests