0

現在、javascript を使用して、サーバーにある csv ファイルを取得し、ファイル内のデータを処理し、結果を Web ページに (表形式で) 印刷しています。

ローカルの csv ファイルを取得する代わりに、処理のために csv データを直接インラインで手動で挿入する必要があります。

これが私のコードです:

<script>
  $(function() {
    $.ajaxSetup({ mimeType: "text/plain" });
    $('#CSVTable').CSVToTable('https://www.example.com/files/test.csv',
        {
          loadingImage: 'https://www.example.com/images/loading.gif',
          headers: ['Plan Information', '&nbsp;'],
          startLine: 0,
          separator: ","
        });
  });
</script>

<div id="CSVTable"></div>

ファイルを取得する代わりに、コード内で csv データを直接指定する方法を見つけてください。理想的には、CSV データを div に入れ、JS を使用してその div 内の csv データを処理したいと考えています。

参考までに: https://code.google.com/p/jquerycsvtotable/を使用しています

https://github.com/evanplaice/jquery-csvも使用してdiv内のCSVを解析することを考えていましたが、うまくいかないようです。

どんな助けでも大歓迎です。

編集:

Mottie のInline CSV Exampleを使用しましたが、それでもうまくいかないようです。
これが私のコードです:

<html>
<head>
<!-- jQuery -->
<script src="https://www.example.com/tablesorter/dist/js/jquery-1.10.2.min.js"></script>

<!-- Tablesorter: required -->
<link rel="stylesheet" href="https://www.example.com/tablesorter/dist/css/theme.blue.css"> <!-- choose any theme -->
<script src="https://www.example.com/tablesorter/dist/js/jquery.tablesorter.js"></script>

<!-- build table widget -->
<script type="text/javascript" src="https://www.example.com/tablesorter/dist/js/widgets/widget-build-table.js"></script>
</head>
<body>
<!--
 Note: if the csv data contains commas ("10,000 days") wrap it in quotes
-->
<div class="csv" style="display:none;">
  Album,Artist,Price (USD)
  Lateralus,Tool,$13.00
  Aenima,Tool,$12.00
  "10,000 days",Tool,$14.00
  Down In It,Nine Inch Nails,$3.00
  Broken,Nine Inch Nails,$6.00
  Muse,Black Holes and Revelations,$7.00
  Anon,"fake album, with comma", $1.00
  Album,Artist,Price (USD)
</div>

<div id="csv2Table"></div>

<script>
$(function() {
  $('#csv2Table').tablesorter({
    theme: 'blue',
    widgets: ['zebra'],
    widgetOptions: {
      // *** build widget core ***
      build_type      : 'csv',
      build_source    : $('.csv'),
      build_complete  : 'tablesorter-build-complete', // triggered event when build completes

      // *** CSV & array ***
      build_headers   : {
        rows    : 1,   // Number of header rows from the csv
        classes : [],  // Header classes to apply to cells
        text    : [],  // Header cell text
        widths  : ['3%', '27%', '50%', '20%'] // set header cell widths
      },
      build_footers : {
        rows    : 1,   // Number of header rows from the csv
        classes : [],  // Footer classes to apply to cells
        text    : []   // Footer cell text
      },
      build_numbers : {
        addColumn : "#", // include row numbering column?
        sortable  : true // make column sortable?
      },

      // *** CSV options ***
      build_csvStartLine : 0,  // line within the csv to start adding to table
      build_csvSeparator : "," // csv separator
    }
  });
});
</script>
</body>
</html>

どんな提案でも大歓迎です!ありがとう。

4

1 に答える 1