MDK Grid Table

[#1]

Hello MDK- Expert,

I have to build a grid table into our application, unfortunately I have some problems understanding how this works. For tablet (ipad) works great but on phone (iphone se2 and any andriod) the columns and lines are not displayed correctly. The columns and header are stacked in the first 20 percent of the available display. (mdk 5.1)

tanks for help

Robert

"Controls": [
		{
			"Sections": [
				{
					"DataPaging": {
						"PageSize": 50,
						"ShowLoadingIndicator": false
					},
					"EmptySection": {
						"Caption": "No Data",
						"FooterVisible": true
					},
					"Header": {
						"Grid": {
							"Items": [
								{
									"NumberOfLines": 1,
									"Text": "Status"
								},
								{
									"NumberOfLines": 1,
									"Text": "ID"
								},
								{
									"NumberOfLines": 1,
									"Text": "Description"
								},
								{
									"NumberOfLines": 1,
									"Text": "Price"
								}
							]
						},
						"UseTopPadding": false
					},
					"Row": {
						"AccessoryType": "none",
						"Items": [
							{
								"NumberOfLines": 1,
								"Text": "OK"
							},
							{
								"NumberOfLines": 1,
								"Text": "588877"
							},
							{
								"NumberOfLines": 1,
								"Text": "that's a very nice thing"
							},
							{
								"NumberOfLines": 1,
								"Text": "22,33"
							}
						],
						"Layout": {
							"ColumnWidthPercentage": [
								0.25,
								0.25,
								0.25,
								0.25
							]
						}
					},
					"Target": {
						"EntitySet": "BarcodeSet",
						"QueryOptions": ".....",
						"Service": "/mobile_scp_eh_logistics/Services/....."
					},
					"Visible": true,
					"_Name": "SectionGrid_Parts",
					"_Type": "Section.Type.GridTable"
				}
			],
			"Target": "",
			"_Name": "SectionedTable0",
			"_Type": "Control.Type.SectionedTable"
		}
	],

Tablet (ipad)

phone (pixel2)

[bill_froelich · Accepted solution]

On the phone, the grid table is automatically converted to an Object Table due to space constraints. In you grid table you can define the mapping of which columns will go where in the object cell when rendered on the phone. Use the BindTo property as defined in the help here

We do have a backlog to look at supporting a scrollable grid on the phone in a future release.

[robert_hunger · Accepted solution]

thx, Bill for your really fast answer.

that's not really what i need. There is no way for 4Colums in a Line ?

[bill_froelich · Accepted solution]

We currently don't have an out of the box control that would provide that on a phone form factor. You could create an extension control or map your columns into the Object cell (Title, Subhead, Footnote and Status).

--Bill

[hkoca · Accepted solution]

Hello,

I have the exact same problem and would like to know if there is an example on how to create an extension control for a grid table?

Best Regards

[Former Member · Accepted solution]

I saw your posted comment. Please raise a new question and follow our rules of engagement: https://community.sap.com/resources/rules-of-engagement. I suggest using the "I have a similar question" option under the question to get started. Feel free to take our Q&A tutorial at: https://developers.sap.com/tutorials/community-qa.html. With these tips you'll be able to prepare questions that draw responses from our members.

Best,

Your SAP Community moderator

[Jitendra_Kansal]

Scrollable grid on the phone (using Data Table control) is now available from MDK 6.1 release onward.