Responsive Example

Responsive Example

cbasmadjiancbasmadjian Posts: 56Questions: 14Answers: 0

I need some help understanding Responsive. Going through the documentation and I am getting into trouble. I have created a live demo to see maybe if there is something wrong in my setup.

<a class="jsbin-embed" href="http://live.datatables.net/tuzifaxe/1/embed?live">JS Bin demo</a>

Just in case the above link is not working...

live.datatables.net/tuzifaxe/1/edit

From my understand there are two ways to initialize it. I have chosen in demo page to use the html way. And I have set a priority to 3 columns that I want to see when a user views it on their phone. When I refresh the page and view on my chrome browser as an iPhone 5 it is showing everything. Maybe the frame that is in is not letting it now to be responsive?

Not sure what I am doing wrong. Can someone point me in the right direction? I am sure I am close, but not understanding what I am doing wrong.

Thank you.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,488Questions: 1Answers: 10,467 Site admin

    The Responsive Javascript needs to be loaded after DataTables:

    http://live.datatables.net/tuzifaxe/2/edit

    Allan

  • kowadagokowadago Posts: 24Questions: 5Answers: 2
    edited November 2017

    I used the download configurators https://datatables.net/download/index and selected all the options I needed and chose the CDN links.

    I am working with bootstrap3, and "Responsive" is one of the options I checked on the download page, yet it is not responsive on mobile view.

    Do I still need to call responsive Js as in the above comment after dataTable CDN link??

  • kowadagokowadago Posts: 24Questions: 5Answers: 2

    Might be worth mentioning that on desktop view the table does not auto adjust to the new width when resizing the window. Not sure if they are related.

  • kowadagokowadago Posts: 24Questions: 5Answers: 2
    Answer ✓

    Removing quotes from "responsive": true, was the issue! it should be responsive: true,

    Now some CSS to do :smile:...

  • allanallan Posts: 63,488Questions: 1Answers: 10,467 Site admin

    That shouldn't have made any difference, but if its working now, excellent.

    Allan

This discussion has been closed.