Datatables - Mobile formatting

Datatables - Mobile formatting

timcadieuxtimcadieux Posts: 76Questions: 22Answers: 0

Hello folkz, I have been working on a project for several months now..this specific page is merely laid out to list various Social Media events regarding a company.

When in desktop mode, everything seems to work exactly how I want (using Bootstrap 4). The issue is in the mobile view. In mobile view (sm/xs), I wish to display 3 columns - Icon, Title, Collapse button. When clicked, the collapse button will expand a child with the Title and Content.

The issue I am seeing is that (when using Chrome), under iPhoneX, the layout looks correct on page 1, but when I page to page 2, the Source column doubles in size and I lose the title. This happens for all follow-up pages.

My Code is here http://live.datatables.net/dawediho/1

PS

For extra points, I was looking for any tips on how to make this code more efficient, whether its better js or other formatting suggestions, I'm open to all, I really want this page as solid as possible.

Answers

  • colincolin Posts: 15,237Questions: 1Answers: 2,599

    I just took a look but the test case isn't running, there's an "illegal break statement" error in the browser's console. Could you take a look, please, so we can see the problem,

    Colin

  • timcadieuxtimcadieux Posts: 76Questions: 22Answers: 0
    edited February 2021

    I had a tonne of problems witj the bin including it telling me over and over i wasn't the owner of the poage. I made a jsFiddle instead..please see - https://jsfiddle.net/timcadieux/7nvu3Let/2/

  • colincolin Posts: 15,237Questions: 1Answers: 2,599

    Thanks for the test case - I'm not seeing that behaviour, possibly because of the stuff around that fiddle changes the problem. I've got access to an iPad and iPhone 11, are you seeing the issue on there in a way that could you could allow us to reproduce it too?

    Colin

This discussion has been closed.