Responsive Table bootstrap modal example not working

Responsive Table bootstrap modal example not working

orioleravenorioleraven Posts: 4Questions: 1Answers: 0
edited May 1 in Free community support

I followed all the steps: https://datatables.net/extensions/responsive/examples/display-types/bootstrap-modal.html

The Basic Datatable functions work, but not the Responsive Table bootstrap modal part. Something is not right.

Attached is my HTML and JavaScript code per the example.

What am I doing wrong?

Answers

  • kthorngrenkthorngren Posts: 21,932Questions: 26Answers: 5,067
    edited May 1

    I opened your test case and it seems to work:

    Please provide details of what isn't working for you. Maybe post a screenshot of the issue.

    Kevin

  • orioleravenorioleraven Posts: 4Questions: 1Answers: 0

    Strange. When the html loads on my desktop or server, the angle icons do not show and clicking the row does not open the dialog. There is no errors in the console or in the network console.

    You can see that it looks like a plain table with the search working etc...

  • kthorngrenkthorngren Posts: 21,932Questions: 26Answers: 5,067
    edited May 1

    Reduce the width of the page and when the table too big to fit you will see the responsive icons.

    Kevin

  • orioleravenorioleraven Posts: 4Questions: 1Answers: 0

    Ahhhh. I went ahead and put a smaller width on the table., still no dice.

    Tried this:

    <

    table id="example" class="table table-striped table-bordered nowrap" style="width: 800px;">

    Even tried this:

    <

    table id="example" class="table table-striped table-bordered nowrap" width="850px">

    Anything else that could change the width and allow for the buttons to show?

  • kthorngrenkthorngren Posts: 21,932Questions: 26Answers: 5,067

    You don't need to change the table width. Datatables will fit the table within the container. You can try changing the container's width. But it might be easier to use the mouse to reduce the width of the web page.

    Kevin

  • orioleravenorioleraven Posts: 4Questions: 1Answers: 0

    oh ok, I see now, you have to shrink the web browser window or container to get this to work. It is more for displaying tables in small areas than to use it for popups.

    Thanks for your help!

  • allanallan Posts: 64,333Questions: 1Answers: 10,623 Site admin

    100% that. If you need a popover / modal for more details without Responsive, you could just bind an event listener to the table and look for a click on a "Details" activation link (or whatever).

    Allan

Sign In or Register to comment.