ブートストラップ・モードのヘッダーの幅のDataTables

Question

部分ビューのデータ型にscrollYを追加すると、ヘッダーは画面の左側に圧縮されます。並べ替えるヘッダーをクリックすると、100％に正しく展開されます。スクロール・オプションを使用して十分にスクロールすると、列が正しく表示されます。

各列ヘッダーの幅を見て、幅は、上記のいずれかを実行した後、0 に設定されている幅は、それらがなければならないように補正されます。私が検索しましたし、私が発見したので、多くのことを試してみました次は、テーブル

$(function() { 
var dt = $('#table-audits-results').DataTable({ 
    order: [[0, "desc"]], 
    buttons: ['csv'], 
    scrollY: 200, 
    scroller: true, 
    responsive: true 
    }); 
}); 

を変換するために呼び出す部分図になりまし部分

$('a[data-target="#list-view-audits-modal"]').on('click', function (e) { 
    e.preventDefault(); 
    $.ajax({ 
     type: "GET", 
     url: "../Home/GetAudits", 
     success: function (data) { 
      $('body').append(data); //this adds the modal called below 
      $('#list-audits-modal').modal('toggle') 
     }, 
     error: function (XMLHttpRequest, textStatus, errorThrown) { 
      WebUI.handleError(XMLHttpRequest, textStatus, errorThrown); 
     } 
    }); 
}); 

をロードするためのメインビューから

トリガー他の投稿ではこれまで何もこの問題を解決していません。私はこれが部分的な見方で変形されていることと関係があると思いますか？

アップデート1

[OK]を、モーダルはまだ大きさを持っていないので、これは問題であると思われるので。これをテストするために、私はデータテーブルを変換するトリガーに遅れを入れ、ヘッダーが正しいようにしました。

ここで、モーダルがサイズを持つとすぐにこれをトリガする方法を理解する必要があります。そのため、ユーザーは標準テーブルを参照せずにDataTablesに変換します。それは

$(document).on('show.bs.modal', '#list-audits-modal', function() { 
    alert('triggered'); 
    var dt = $('#table-audits-results').DataTable({ 
     order: [[0, "desc"]], 
     buttons: ['csv'], 
     scrollY: 200, 
     scroller: true, 
     responsive: true 
    }); 
}); 

を変換しています前に、私は次のことを試してみましたが、それでもデータロードの質量量を参照してください

アップデート2

アップデート3

Iこれが理想的だとは思わないでください。ユーザーはヘッダーが間違っていると判断して、より良い解決策を探します。

私は部分ビューで何を使用していますか？

var dt = $('#table-audits-results').DataTable({ 
    order: [[0, "desc"]], 
    dom: 'Bfrtip', 
    buttons: ['csv'], 
    scrollY: 200, 
    scroller: true, 
    responsive: true 
}); 

$(document).on('shown.bs.modal', '#list-audits-modal', function() { 
    dt.columns.adjust().draw(); 
}); 

Answer 1

$(document).on('shown.bs.modal', '#list-audits-modal', function() { 
    dt.columns.adjust().draw(); 
}); 

グッド ですが、サーバーの処理があなたの最新のスニペットがある