2016-09-29 1 views
0

データを.xlsxファイルにエクスポートすることができる自分のボタンに関する問題が発生しました。それはEdge、Mozilla、Chromeにはうまくいきますが、もし私がiPhoneやMacbookのSafariを試してみたらボタンが見えなくなってしまっているようです。データテーブルを使用したSafariのExcelボタンの問題

適切な解決策が見つからないので、私は実際にこれを手助けする必要があります。データのエクスポートは、Safari、Mozilla、Edge、Chromeで完全に動作するはずです。

誰かが同様の問題に直面したのでしょうか? マイコード:

$(document).ready(function() { 
var table = $('#tableOrders').DataTable({ 
    "bFilter" : true,    
    "bLengthChange": true, 
    "paging": true, 
    "ordering": true, 
    "order": [[ @if ($user->role=='super_admin') 7 @else 6 @endif, "desc" ]], 
    "info":true, 
    dom: 'lBfrtip', 
    lengthMenu: [ 
     [ 10, 25, 50, -1 ], 
     [ '10', '25', '50', 'Show all' ] 
    ], 
    buttons: [ 
     { 
      extend: 'copyHtml5', 
      text: '<b>Copy all</b>', 
      exportOptions: { 
       columns: [@if($user->role=='super_admin') 0, 1, 2, 3, 4, 5, 6 @else 0, 1, 2, 3, 4 @endif] 
      } 
     }, 
     { 
      extend: 'excelHtml5', 
      text: 'Export all to <b>Excel</b>', 
      exportOptions: { 
       columns: [@if($user->role=='super_admin') 0, 1, 2, 3, 4, 5, 6 @else 0, 1, 2, 3, 4 @endif] 
      } 
     }, 
    ] 
}); 

})。

答えて

1

excelHtml5ボタンはSafariではサポートされていません。ノートはそれについてのドキュメント(https://datatables.net/reference/button/excelHtml5)であり:

サファリ:いいえ

サファリは現在、(WebKitのバグ156056を参照してください)生成されたファイルをダウンロードする機能をサポートしていません。これがSafariで対処されるとすぐに、ここでリリースされます。

Safariでデモを開こうとすると:https://datatables.net/extensions/buttons/examples/initialisation/export.html SafariでExcelボタンが表示されません。

さらに、フォーラムディスカッション(https://datatables.net/forums/discussion/30444/datatables-built-in-buttons-not-working-with-safari-browser)に基づいて、csvボタンはSafariでのサポートが制限されています。生成されたcsvを含む新しいタブが開きます。デモページで試してみてください。

0

上記のように同じ問題が発生しましたが、これはサポートされていません。しかし、あなたがブラウザ間で完全性を維持したいなら、あなたはsafariのためにuser-agentを介してvalidadして文字列を変数に渡すことができます。 CSVはSafariで動作するためです。その後、

var xls; // variable csv ó excel 
    (navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1) ? xls = 'csv' : xls = 'excel'; //verify 

次の拡張:

extend: xls, title: 'yourtitle', className: "btn-sm" 
関連する問題