Table Records: labels Header Row displayed in every Row

Weird issue, I hope somebody can help me solve it.

I'm building an app for some experimenting with the OMDb API. 

One of the screens is a straight forward movie list, scaffolded using the Film entity. So far so good. 


In the webscreen for adding a new movie I've built some functionality to show the result list of a search in the OMDb in a popup.The OMDb API returns a movie list, but I cannot asign this result list to the Source Record List of the Records Table on the screen. So I asign the result list to a local variable, SearchList, with type Movie List. This local variable is asigned to the Source Record List.


As you can see in the image above the header row labels are repeated in evey row, with the following result when running the app:


I've cpmpared the Table Records above with the scaffolded ones, no differences. I've even copied a Table Records from another webscreen, replaced the variables and got the same 'weird' result in the end.

Is it becase I use a local list variable as the source for the Table Records?

I hope somebody can tell me how to get rid of the repeating heading row labels.


Hi Charles,

Are you using the device preview mode? If yes can you try not using it and check if it works correctly.

Regards,

Marcelo

Marcelo Ferreira wrote:

Hi Charles,

Are you using the device preview mode? If yes can you try not using it and check if it works correctly.

Regards,

Marcelo

Hi Marcelo, no, I'm not using the device preview mode. The last print screen in my post is part of a Chrome tab, while running the app on my desktop.

Regards, Charles


Hi Charles,

Can you share with us the OML or a sample with the code for that case?

Thanks!


Best regards,

Ricardo

Ricardo Pereira wrote:

Hi Charles,

Can you share with us the OML or a sample with the code for that case?

Thanks!


Best regards,

Ricardo

No problem Ricardo, attached the export (OML).

When running the app (mostly in Dutch, sorry :-)) ... choose 'Films', then 'Create a new film'.

In the input field 'Titel' enter for example 'Potter' and press the icon that shows up at the right side of the input field. A pop up appears with the result set of the OMDb API, showing the header labels in each row.

Hi Charlet,

Just check the shared OML and followed the steps but m not able to see any of the duplicate headers.



Regards,

Pankaj


Hi Charles,

This is definitely the result of the Theme being responsive, and the pop-up having a width that's smaller than desktop. As for a solution, I must admit I don't know, but I'll ask around.

Hi,

Just like Pankaj, I don't have any problem opening the popup:


Did you already try to change the AutoResize property to yes and see his behavior?


Regards,

Ricardo

Hi,

But I am able to reproduce the issue when your browser zoom is more than 100% or higher that the issue is coming.


Can you try to make the browser zoom 100% maybe if you have a higher zoom?


the plus icon in the right


Regards,

Pankaj

Kilian Hekhuis wrote:

Hi Charles,

This is definitely the result of the Theme being responsive, and the pop-up having a width that's smaller than desktop. As for a solution, I must admit I don't know, but I'll ask around.

Hi Kilian,

Changed the width param (to empty, to 1600) ... but still got the header labels in every row.
Thnx for asking around, perhaps anyone encountered the same problem.

Regards, Charles


Hi Ricardo, Pankaj,

Thnx for looking into my problem.

I did some experimenting wrth the AutoResize param, but no effect.
Also tried zooming the browser tab (ctrl-, ctrl+, ctrl0) but still the header labels in every row.

Weird, very weird, that you don't experience my problem, so I tried another laptop than my Lenovo Yoga 2 Pro (a touch screen device), a Dell XPS17 (no touch screen), but same problem.

Than I switched from Chrome to Edge, on both laptops ... no effect either.

It's just a practise app for me, so no urgency to solve it, but strange it is :-)
What I'll try later today or tomorrow is duplicate the records table and populate it with the result set of some aggregate. Something tells me it might have something to do with the fact I populate the table with a local variable in stead of an aggrete.

Kind regards, Charles

Hi Charles,

I did experience the same thing you had, sorry if it wasn't clear. Like I said, this is purely a CSS thing based on screen width, and it can really never have anything to do with the source of the Table Records!

Kilian Hekhuis wrote:

Hi Charles,

I did experience the same thing you had, sorry if it wasn't clear. Like I said, this is purely a CSS thing based on screen width, and it can really never have anything to do with the source of the Table Records!

Ok, I get it Kilian ... waste of time than trying to replace the local variable with an aggregate result list :-)

But it still confuses me that I'm experiencing this problem on different laptops, using both Edge and Chrome, and others do not have this issue when using my oml.

Grz, Charles


Eureka ... I solved the issue! I don't know exactly how/why, but maybe somebody can explain that to me :-)

What I did ... I changed the Source Web Block property from 'Layouts\LayoutPopup' into 'LayoutsOther\Layout_Popup' and voila, the header labels disappeared from the data rows.


Mmm, that's actually something that I tried and that didn't seemed to work...

Layouts\LayoutPopup comes from OutSystemsUIWeb, while LayoutsOther\Layout_Popup comes from RichWidgtets. But like I said, that didn't seem to work for me, so be careful :).

Solution

Hi! This seems like an issue with the layout popup of OutSystems UI, related to the responsive of the Table Records. I'll follow up with the team.

Solution

Thnx all !

Hi all,


I figured I'd weigh in to say that I've recreated this issue outside of a popup in Outsystems 11.5.43- I've got a page where if I refresh it twice while the browser is set to half of my screen's width those labels appear (they're divs tagged with TableRecords_Label). The labels remain until I refresh the page twice with the browser maximized. The table is not in a popup.