Handsontable:我想导出没有HTML的CSV文件

时间:2017-06-01 06:44:43

标签: javascript handsontable

我想将我的handsontable导出为CSV文件,但其渲染为html。因此,当它下载时,它会在那里显示HTML,我们将不胜感激。

这是我的jsfiddle代码

这是片段。

document.addEventListener("DOMContentLoaded", function() {

  var example1 = document.getElementById('example1');
   var data = [
    ['ABC', "DEF", "GHI", "JJJ", "KKK", "LLL"],
    [2009, 0, 2941, 4303, 354, '<a href="#"> 123 </a>'],
    [2010, 5, 2905, 2867, 123, '<a href="#"> 456456 </a>'],
    [2011, 4, 2517, 4822, 552, '<a href="#"> 8254 </a>'],
    [2012, 7777, 7777, 9999, 12, '<a href="#"> 456 </a>']
  ];
  var hot = new Handsontable(example1, {
    data: data,
    renderer:"html",
    colHeaders: true,
    rowHeaders: true
  });
  
  var buttons = {

    file: document.getElementById('export-file')
  };
  
  var exportPlugin = hot.getPlugin('exportFile');
  var resultTextarea = document.getElementById('result');
  
 
  buttons.file.addEventListener('click', function() {
    exportPlugin.downloadFile('csv', {filename: 'MyFile'});
  });
  


});
</style><!-- Ugly Hack due to jsFiddle issue -->

<script src="https://docs.handsontable.com/pro/1.8.2/bower_components/handsontable-pro/dist/handsontable.full.min.js"></script>
<link type="text/css" rel="stylesheet" href="https://docs.handsontable.com/pro/1.8.2/bower_components/handsontable-pro/dist/handsontable.full.min.css">
<div>
  <div id="example1" class="hot handsontable htRowHeaders htColumnHeaders"></div>
</div>
<br>

<button id="export-file" class="intext-btn">
  Export as a file
</button>

1 个答案:

答案 0 :(得分:0)

尝试这样的事情

<强> CODE:

Task.Delay()

<强>结果:

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
</head>
<body>
    <script>
    //  Data
    var data = [
        ['ABC', "DEF", "GHI", "JJJ", "KKK", "LLL"],
        [2009, 0, 2941, 4303, 354, '<a href="#"> 123 </a>'],
        [2010, 5, 2905, 2867, 123, '<a href="#"> 456456 </a>'],
        [2011, 4, 2517, 4822, 552, '<a href="#"> 8254 </a>'],
        [2012, 7777, 7777, 9999, 12, '<a href="#"> 456 </a>']
        ];

    //  Function for remove HTML
    function strip(html)
    {
       var tmp = document.createElement("DIV");
       tmp.innerHTML = html;
       return tmp.textContent || tmp.innerText || "";
    }

    //  Test
    $(data).each(function(index,item){
      console.log("With html element: "+index+" item: "+data[index]);
      console.log("Without html element: "+index+" item: "+strip(data[index]));
    });
    </script>
</body>
</html>