How can i create two columns for one table?

How can i create two columns for one table?

anivariesanivaries Posts: 5Questions: 2Answers: 0

I've been trying to figure it out but i just can't. I have this table with only one column which is paginated ( every 15 tr ) but i want to show like 30 trs in two columns, to fill empty space and make less pages

I figured there is some way to do it with odd and even. I tried "<'row'<'col-6 odd'tr><'col-6 even'>>" but that doesn't work, it just puts everything in the 2nd col

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 20,139Questions: 26Answers: 4,735

    For Datatables you will need to define two headers (th) in HTML. If your table is DOM sourced then you will need to populate the two columns with the data you want. If this doesn't help then please provide more details of how your table data is populated and your Datatables initialization code.

    Kevin

  • anivariesanivaries Posts: 5Questions: 2Answers: 0

    Yes, i have title of this list as th which seems to work fine, i did some css and html changes on it. I populated datatables with Django for loop in html.

    $(document).ready(function () {
      $('#table').dataTable({
        "dom": 'lrti' + "<'row'<'col-sm-12 col-md-5'f><'col-sm-12 col-md-7'p>>",
        "autoWidth": true,
        "responsive": true,
        "info": false,
        "searching": true,
        "lengthChange": false,
        "ordering": false,
        "fnDrawCallback": function (oSettings) {
          if (oSettings._iDisplayLength > oSettings.fnRecordsDisplay()) {
            $(oSettings.nTableWrapper).find('.dataTables_paginate').hide();
          } else {
            $(oSettings.nTableWrapper).find('.dataTables_paginate').show();
          }
        }
      })
    })
    ;
    

    And this is html code

    <div class="row justify-content-center margin-test">
                    <h3 class="mb-0"><table data-page-length='15' id="table" class="display" style="width:100%">
                        <thead>
                            <tr>
                                <th class="text-center erlorefont" style="color:orange">{{ title.0 }}</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for item in lore_list %}
                                    <tr> 
                                        <td class="erlorefont "><a style="text-decoration:none;" href="{% url 'lores:loreitems' item.id %}">{{item}}</a></td>
                                    </tr>
                            {% endfor %}
                        </tbody>
                    </table></h3>
            </div>  
    
  • kthorngrenkthorngren Posts: 20,139Questions: 26Answers: 4,735
    Answer ✓

    If you want Django to build the HTML table then you will need to have Django build two th in the header and populate the to columns in the tbody. The result should look similar to this example. Click the HTML tab.

    Kevin

  • anivariesanivaries Posts: 5Questions: 2Answers: 0

    Yeah, seems like this is more of a Django / HTML issue than datatables. I just need to make Django make different columns for each odd/even loop

Sign In or Register to comment.