Showing R/3 Table as a Grid in Web Dynpro

[Former Member]

Hello,

I am on SAP Netweaver 7.0 SP10. I am developing a Web Dynpro screen to show list of products. I have list of products in a Table from backend. But in Web Dynpro, I dont want to show it as table. Instead of displaying the products in a Table, I want to show products in a 3x4 Grid, something like we see in Amazon or any other web shop.

Does anybody have ideas on how to achieve this. I appreciate your help.

Regards,

Sunita.

[Former Member]

Thanks Dennis and Armin. Armin, are there any plans in the future to add this UI Requirement to Web Dynpro UI list?

Thanks,

Sunita.

[Former Member]

There will be a Grid UI element in a later release (NW 7.1) but I am not sure when this will be generally available. Nevertheless, you can achieve what you need already with NW04 means.

Armin

[Former Member]

Maybe the easiest way is to use a RowRepeater. This offers a trivial data binding and you don't need to build the view by code. But it only offers row-based layout, not grid-like.

A grid-like layout can be achieved by programmatic view creation and probably you need to create the context too programmatically which might get non-trivial.

Armin

[Former Member]

Hi,

I think it is not a minor thing you want to do!

The only way to solve this is to create the view at runtime.

You can do so in the WdDoModify method with the view parameter.

Here is a small code example to give you a clue:

//Add Label
IWDLabel label = (IWDLabel)element;  	
		IWDLabel newLabel = (IWDLabel) view.createElement(IWDLabel.class,"Label" + number);

		newLabel.setDesign('labelDesign');
...
//and so on

//add transparent container

IWDTransparentContainer transparentContainer = (IWDTransparentContainer)element;
	  	IWDTransparentContainer newTransparentContainer = (IWDTransparentContainer) view.createElement(IWDTransparentContainer.class,"TransparentContainer" + number);
  	
		newTransparentContainer.setEnabled(true);
...
//and so on

To the transparent container or a group you cann then add the labels, input fields or any other ui element that you can also add in the Layout perspective.

I hope this can help you.

Regards,

Dennis