Funzioni SlickGrid per l'esportazione CSV?

Question

All'interno di un'applicazione Django, sto usando SlickGrid di legare alcuni dati XHR ad un foglio di calcolo sul lato client:

var grid; 
var review_url = '/api/reviews/?t=' + current_tcode; 
$.getJSON(review_url, function(data) { 
    grid = new Slick.Grid("#myGrid", data, columns, options); 
}); 

Vorrei anche per dare all'utente la possibilità di scaricare i dati in un file CSV . Qual è l'approccio migliore per farlo?

1. Basta collegarsi a un file CSV che eseguo da solo (con Piston, che sto già utilizzando per l'API).
2. Fai qualcosa di intelligente utilizzando SlickGrid per generare dati CSV sul lato client.
3. Qualcos'altro.

SlickGrid è dotato di tutte le funzionalità necessarie per l'output in CSV, ma non riesco a trovare nulla durante una ricerca rapida.

Answer 1

SlickGrid è puramente un componente per la visualizzazione. Alimentatelo e lo renderà come una griglia per l'utente. Diamine, non è nemmeno abbastanza intelligente per ordinare i dati.

Come tale, non ha alcuna funzionalità per trasformare i dati in alcun modo. Pertanto, se si desidera ottenere i dati della griglia in formato CSV, sono disponibili due opzioni:

Opzione 1. Renderizzare CSV lato client generandolo direttamente dall'array data sottostante. Dato che stai già restituendo i dati in formato json, dovresti riuscire a farlo abbastanza facilmente con something like this.

oppure

Opzione 2. Render lato server CSV e renderlo accessibile tramite url, possibile con l'aggiunta di un parametro di formattazione al tuo review_url.

Non conosco alcuna funzionalità nella griglia che possa aiutarti, ma forse qualcuno mi correggerà.

Answer 2

A mio parere se si desidera solo CSV: renderlo sul server.
Inoltre, è possibile trovare interessante this railscasts episode - solo gli strumenti di ricerca adatti a Django per farlo.

Answer 3

Si consiglia di guardare a questo: CellExternalCopyManager is a SlickGrid plugin to copy/paste data from/to MS Excel (or compatible)

Answer 4

Per l'esportazione in formato CSV è possibile utilizzare questa funzione:

$("#exporticon").click(function() { 
    var processRow = function (row) { 
     var finalVal = ''; 
     for (var j = 0; j < row.length; j++) { 
      var innerValue = row[j] === null ? '' : row[j].toString(); 
      if (row[j] instanceof Date) { 
       innerValue = row[j].toLocaleString(); 
      }; 
      var result = innerValue.replace(/"/g, '""'); 
      if (result.search(/("|,|;|\n)/g) >= 0) 
       result = '"' + result + '"'; 
      if (j > 0) 
       finalVal += ','; 
       finalVal += result; 
     } 
     return finalVal + '\n'; 
    }; 

    var csvFile = ''; 
    var rows = []; 
    var colname = []; 
    for (var j = 0, len = grid.getColumns().length; j < len; j++) { 
     colname.push(grid.getColumns()[j].name); 
    } 
    rows.push(colname); 
    var singlerow = []; 
    for (var i = 0, l = dataView.getLength(); i < l; i++) { 
     for (var j = 0, len = grid.getColumns().length; j < len; j++) { 
      singlerow.push(grid.getDataItem(i)[grid.getColumns()[j].field]); 
     } 
     rows.push(singlerow); 
     singlerow = []; 
    } 

    for (var i = 0; i < rows.length; i++) { 
     csvFile += processRow(rows[i]); 
    } 

    var blob = new Blob([csvFile], { type: 'text/csv;charset=utf-8;' }); 
    if (navigator.msSaveBlob) { // IE 10+ 
     navigator.msSaveBlob(blob, "filename.csv"); 
    } else { 
     var link = document.createElement("a"); 
     if (link.download !== undefined) { // feature detection 
      // Browsers that support HTML5 download attribute 
      var url = URL.createObjectURL(blob); 
      link.setAttribute("href", url); 
      link.setAttribute("download", "filename.csv"); 
      link.style.visibility = 'hidden'; 
      document.body.appendChild(link); 
      link.click(); 
      document.body.removeChild(link); 
     } 
    } 
});