How to change the cell property of the Table UI

[Former Member]

Hi all,

I'm using Table UI and wondering is there anyway to change the attribute/property of the cell (row, column). I couldn't find a method in Table / TableColumn API to achieve this purpose.

Has anyone ever done this before? Thanks.

I knew in HTMLB (used by EP5), there is a method to refer to table Cell and we can change the attribute/property. As an example: Attendance Overview (part of MS package).

Best regards,

Fendy W

[Former Member]

Hi Guys,

Now, I'm able to change the cell property (row,column) from the context binding. Thanks for your information.

But I still haven't fully achieved the development requirement. We want to differentiate the table cell based on the status, e.g. Approve/Reject. The table cell is made of Input Field UI, so employee can enter their timesheet hours. When the hours get approved, we want the Input field to have some kind of Green/red color on its border (Similar to the Error handler in WebDynpro. when error handling is implemented, the input field border turn red when error occured).

Is there anyway we can achieve this requirement?

Thanks and Regards,

Fendy

[Former Member]

Hi Fendy,

we run into the same problem - twice. Updating the context (model) for each table row is not enough. We would need to define either different cell editors for a column depending on the row index or to define a customized cell editor per column. Example use cases are:

• Different Drop Down Boxes in a column for each table row

• Different Images (e.g. status image) in an other column for each table row

Therefore the Java Swing Framework offers you the possibility to extend the standard Cell Editor / renderer in order to behave differently for each row depending on the underlying model.

Since WebDynpro doesn't allow to extend any framework elements, we have to cope with the predefined ones. Is there any solution porposed by SAP?

regards

Michael

[Former Member]

Michael,

you can achieve both of your use cases with the current IWDTable UI element:

1. Different Drop Down Boxes in a column for each table row:

Let X be the view context node used as the table's data source. Add to X a (non-singleton) subnode Y with an attribute A containing the texts you want to display in your drop-down list boxes. Use an IWDDropDownByIndex as table cell editor, bind the "texts"-property to attribute A.

2. Different Images (e.g. status image) in an other column for each table row

Add an attribute I to X. Use a IWDCaption (IWDImage) as table cell editor and bind its "imageSource" ("image")-property to attribute I.

Regards, Armin

[Former Member]

Hello Armin,

thank you for the response. Concerning the solution to the first use case (Drop Down Boxes) you propose the usage of the cell editor "IWDDropDownByIndex". Is there an appropriate solution using the "IWDDropDownByKey" (since the box by index allows empty selections).

Thank you in advance. Regards,

Michael

[Former Member]

Hi Michael,

use selection cardinality 1:1 instead of 0:1 for the context node, this removes the empty selection item.

Hope that helps.

Regards

Stefan

[Former Member]

IWDDropDownByKey would not work, because you cannot have a different data type per row.

Concerning the empty item, see Stefan's answer.

Regards, Armin

[Former Member]

Hi Stefan/Armin,

Thanks very much for the information.

I will try it.

Best Regards,

Fendy

[Former Member]

Hi Armin,

We are developing CATS (Time Sheet) functionality use Web Dynpro. One of the functionality is the data entry screen.

The data entry screen is displayed using Web Dynpro table. It has Activity type, WBS, Day1-7 columns, etc.

Employee enter their timesheet weekly and they can enter the time against a different WBS/Activity type/Cost Centre. It means a separate row required for each WBS/Cost Centre/Act Type.

The Manager then will approve or Reject the timesheet. Once approved, we would like to have some kind of approval indicator on each cell (e.g. change the color of the field cell, or disable the field cell) to distinguish which days have been approved/Reject/ or haven't been actioned.

Basically, what we are trying to achieve is very similar to the existing CATS functionality based on ITS. When approved, the day1-7 field cell will have a green color.

Currently in Web Dynpro I'm able to refer to the table column using IWDTableColumn, but unable to refer to the row of the table column.

As mentioned in my previous posting, this functionality can be achieved in HTMLB. The following code shown that TableColumn has a method to refer to its row:

for (int i = 1; i <= monthCount; i++) {

TableColumn col = model.getColumn(IMAGE_PRAEFIX + i);

for (int j = 1; j <= rowCount; j++) {

col.setCellHAlignment(j, CellHAlign.CENTER);

col.setCellVAlignment(j, CellVAlign.MIDDLE);

if (col.getValueAt(j).toString().equals("")) {

col.setCellType(j, TableColumnType.TEXT);

}

else {

col.setType(TableColumnType.IMAGELINK);

col.setLinkColumnKey(URL_PRAEFIX + i);

}

}

Is that possible to have this kind of functionality in Web Dynpro?

Best Regards,

FendyW

[Former Member]

Hi Fendy,

this is possible. You have to provide a Context node, which has the table editor properties as value attributes available for the table column(s). For the scenario you mentioned you could use an IWDLinkToAction, binding the image and text-properties to the node-attributes and setting the attribute contents (no text and image or vice versa) at runtime according to the approved/rejected state. This will paint the link once as text, once as image for each table row.

Hope that helps.

Regards

Stefan

[Former Member]

Could you give an example what you want to achieve?

Regards, Armin

[Former Member]

Hi Armin,

We are developing CATS (Time Sheet) functionality use Web Dynpro. One of the functionality is the data entry screen.

The data entry screen is displayed using Web Dynpro table. It has Activity type, WBS, Day1-7 columns, etc.

Employee enter their timesheet weekly and they can enter the time against a different WBS/Activity type/Cost Centre. It means a separate row required for each WBS/Cost Centre/Act Type.

The Manager then will approve or Reject the timesheet. Once approved, we would like to have some kind of approval indicator on each cell (e.g. change the color of the field cell, or disable the field cell) to distinguish which days have been approved/Reject/ or haven't been actioned.

Basically, what we are trying to achieve is very similar to the existing CATS functionality based on ITS. When approved, the day1-7 field cell will have a green color.

Currently in Web Dynpro I'm able to refer to the table column using IWDTableColumn, but unable to refer to the row of the table column.

As mentioned in my previous posting, this functionality can be achieved in HTMLB. The following code shown that TableColumn has a method to refer to its row:

for (int i = 1; i <= monthCount; i++) {

TableColumn col = model.getColumn(IMAGE_PRAEFIX + i);

for (int j = 1; j <= rowCount; j++) {

col.setCellHAlignment(j, CellHAlign.CENTER);

col.setCellVAlignment(j, CellVAlign.MIDDLE);

if (col.getValueAt(j).toString().equals("")) {

col.setCellType(j, TableColumnType.TEXT);

}

else {

col.setType(TableColumnType.IMAGELINK);

col.setLinkColumnKey(URL_PRAEFIX + i);

}

}

Is that possible to have this kind of functionality in Web Dynpro?

Best Regards,

FendyW

[Former Member]

Hi Armin,

We are developing CATS (Time Sheet) functionality use Web Dynpro. One of the functionality is the data entry screen.

The data entry screen is displayed using Web Dynpro table. It has Activity type, WBS, Day1-7 columns, etc.

Employee enter their timesheet weekly and they can enter the time against a different WBS/Activity type/Cost Centre. It means a separate row required for each WBS/Cost Centre/Act Type.

The Manager then will approve or Reject the timesheet. Once approved, we would like to have some kind of approval indicator on each cell (e.g. change the color of the field cell, or disable the field cell) to distinguish which days have been approved/Reject/ or haven't been actioned.

Basically, what we are trying to achieve is very similar to the existing CATS functionality based on ITS. When approved, the day1-7 field cell will have a green color.

Currently in Web Dynpro I'm able to refer to the table column using IWDTableColumn, but unable to refer to the row of the table column.

As mentioned in my previous posting, this functionality can be achieved in HTMLB. The following code shown that TableColumn has a method to refer to its row:

for (int i = 1; i <= monthCount; i++) {

TableColumn col = model.getColumn(IMAGE_PRAEFIX + i);

for (int j = 1; j <= rowCount; j++) {

col.setCellHAlignment(j, CellHAlign.CENTER);

col.setCellVAlignment(j, CellVAlign.MIDDLE);

if (col.getValueAt(j).toString().equals("")) {

col.setCellType(j, TableColumnType.TEXT);

}

else {

col.setType(TableColumnType.IMAGELINK);

col.setLinkColumnKey(URL_PRAEFIX + i);

}

}

Is that possible to have this kind of functionality in Web Dynpro?

Best Regards,

FendyW

[Former Member]

The Web Dynpro IWDTable UI element does not have explicit cell objects.

The table is organized into columns of type IWDTableColumn. Each column has a cell editor of type IWDTableCellEditor that renders all cells in that column.

The rows are defined by the elements of the context node that is used as the table's data source.

To set the value of an attribute "A" for the table cell (columnID, rowIndex), you might:

- Define a value attribute "A" in the context node that is used as the table's data source

- Bind a property of the column's table cell editor to "A"

Then you can control the cell (columnID, rowIndex) by the value of "A" in node element at index "rowIndex".

Hope this helps.

Armin

[Former Member]

Hi, as far as I know there is no way to refer to cell.

The object you are working with is column and all the properties are column related (as binding or visualization). You can see this structure in outline view in IDE or refer to it dynamically.

Best Regards,

Victor.