Как правильно использовать таблицы данных в Flask с использованием шаблонов - PullRequest
0 голосов
/ 01 ноября 2019

Я пытаюсь сформировать шаблон, используя таблицы данных. По некоторым причинам мои таблицы данных не работают должным образом.

Это мой base.html, я поместил Jquery внизу страницы, чтобы я мог повторно использовать запрос каждый раз.

  '''

  <head>

  </head>
  <body>

            {% block content %} {% endblock %}
   <script src="static/plugins/datatables-bs4/js/dataTables.bootstrap4.js"></script>

    <script>
            $(function () {
                $('#table1').DataTable({
                  "paging": true,
                  "lengthChange": false,
                  "searching": false,
                  "ordering": true,
                  "info": true,
                  "autoWidth": false,
                });
              });
            </script>
  </body>

'''

Здесь я планирую использовать его. по какой-то причине thead не выводит таблицу, как ожидалось.

'''
  {% extends "base.html" %} {% block content %}
      <table id="table1">
          <thead> 
             <tr>Company Name</tr>
             <tr>Pre Money Value</tr>
             <tr>Post Money Value</tr>
             <tr>Round Size </tr>
             <tr>Investment Cost </tr>
             <tr>Status </tr>
              </thead>
      </table>

  {% endblock %}

'''

Любая помощь будет оценена по достоинству

Ответы [ 2 ]

0 голосов
/ 01 ноября 2019

Я пытался, по какой-то причине thead не показывает Консоль имеет ошибки, но я не знаю, как это исправить

jquery.min.js:2 Uncaught TypeError: Cannot read property 'aDataSort' of undefined
    at _fnSortFlatten (jquery.dataTables.js:5889)
    at _fnSortingClasses (jquery.dataTables.js:6227)
    at loadedInit (jquery.dataTables.js:1208)
    at HTMLTableElement.<anonymous> (jquery.dataTables.js:1306)
    at Function.each (jquery.min.js:2)
    at k.fn.init.each (jquery.min.js:2)
    at k.fn.init.DataTable [as dataTable] (jquery.dataTables.js:869)
    at k.fn.init.$.fn.DataTable (jquery.dataTables.js:15161)
    at HTMLDocument.<anonymous> (test:318)
    at e (jquery.min.js:2)
0 голосов
/ 01 ноября 2019

DataTables ожидает полностью сформированную таблицу HTML, которая вам не хватает.

С сайта DataTables:

Для того, чтобы DataTables могли правильно функционировать, HTML-код для целевой таблицы должен быть правильно оформлен с помощью theadи объявлены разделы 'tbody'.

Например:

<table id="table_id">
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
            <th>etc</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Row 1 Data 1</td>
            <td>Row 1 Data 2</td>
            <td>etc</td>
        </tr>
        <tr>
            <td>Row 2 Data 1</td>
            <td>Row 2 Data 2</td>
            <td>etc</td>
        </tr>
    </tbody>
</table>

Примечательно, что ваша таблица отсутствует <tbody>. Из вашего кода неясно, что вы на самом деле намереваетесь иметь в теле таблицы, но вам также необходимо убедиться, что ваши данные соответствуют соответствующим строкам / столбцам.

Я бы также предложил использовать $(document).ready();, если вы не привязываете свою функцию к нажатию кнопки или чему-то еще.

Также с сайта DataTables:

$(document).ready( function () {
    $('#myTable').DataTable();
} );
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...