Возможность получения данных с фильтром столбца, заголовок не совпадает с телом - PullRequest
Новая
       15

Возможность получения данных с фильтром столбца, заголовок не совпадает с телом

0 голосов
/ 30 октября 2019

Дополнительный вопрос от: Доступен для данных с фильтрацией столбцов, но с той же шириной, что и без

Как настроить размер столбца заголовка в соответствии с размером столбца тела? (не наоборот. Колонки тела имеют идеальную ширину). 

$(document).ready(function() {
    $('#example thead tr').clone(true).appendTo( '#example thead' );
    $('#example thead tr:eq(1) th').each( function (i) {
        var title = $(this).text();
        $(this).html( '<input type="text" style="width:100%" />' );

        $( 'input', this ).on( 'keyup change', function () {
            if ( table.column(i).search() !== this.value ) {
                table
                    .column(i)
                    .search( this.value )
                    .draw();
            }
        } );
    } );
    var table = $("#example").DataTable({
                orderCellsTop: true,
                fixedHeader: true,
                scrollingCollapse: true,
                paging: false,
                searching: false,
                info: false,
                scrollCollapse: true,
                scrollY: "35vh",
                'createdRow': function(row, data, dataIndex){
                    $('td:eq(11)', row).css('min-width', '126px');
                }
            });
} );
body{
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-weight: 400;
    line-height: 1.5;
  text-align: left;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<link href="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<div style="width: 1370px; font-size:14px;">
<table id="example" class="table table-striped table-bordered">
          <thead>
              <tr>
                  <th>Hostname</th>
                  <th>Film</th>
                  <th>AktlHelewafe Version</th>
                  <th>BntlNiJus Version</th>
                  <th>NntjGpuwllre Version</th>
                  <th>AA</th>
                  <th>RR</th>
                  <th>Letzter Keickvcen</th>
                  <th>Letzter Hujlsken</th>
                  <th>Ausstehende Vorgänge</th>
                  <th>Besnakmefojlen</th>
                  <th>Stand</th>
                  <th></th>
              </tr>
          </thead>
          <tbody>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.13.17134.619</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                 <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
              <tr>
                  <td>Tiger Nixon</td>
                  <td>Systemt</td>
                  <td>4.18.1902.5</td>
                  <td>1.303.522.0</td>
                  <td>1.303.522.0</td>
                  <td>X</td>
                  <td>X</td>
                  <td>7 Days</td>
                  <td>7 Days</td>
                  <td></td>
                  <td>XXXXXXXXXX</td>
                  <td>30.09.2019 15:31:41</td>
                  <td>XX</td>
              </tr>
          </tbody>
      </table>
</div>

Редактировать: Нужно написать больше, чтобы исправить исправленный код ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...