2012-07-16 18 views
5

एक Django आवेदन के भीतर, मैं एक क्लाइंट-साइड स्प्रेडशीट के लिए कुछ एक्सएचआर डेटा बाध्य करने के लिए SlickGrid उपयोग कर रहा हूँ:सीएसवी निर्यात के लिए SlickGrid कार्यों?

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

मैं भी उपयोगकर्ता CSV फ़ाइल के रूप डेटा डाउनलोड करने का विकल्प देना चाहते हैं । ऐसा करने का सबसे अच्छा तरीका क्या है?

  1. बस एक CSV फ़ाइल से लिंक करें जो मैं स्वयं प्रस्तुत करता हूं (पिस्टन के साथ, जिसे मैं पहले ही एपीआई के लिए उपयोग कर रहा हूं)।
  2. ग्राहक पक्ष पर CSV डेटा आउटपुट करने के लिए SlickGrid का उपयोग करके कुछ चालाक करें।
  3. कुछ और।

स्लिमग्रिड पूरी तरह से फ़ीचर करता है कि इसमें सीएसवी आउटपुट के लिए कुछ अंतर्निहित हो सकता है, लेकिन मुझे त्वरित खोज पर कुछ भी नहीं मिल रहा है।

उत्तर

2

SlickGrid पूरी तरह से विज़ुअलाइज़ेशन के लिए एक घटक है। इसे डेटा फ़ीड करें, और यह इसे उपयोगकर्ता को ग्रिड के रूप में प्रस्तुत करेगा। बिल्ली, यह डेटा को सॉर्ट करने के लिए पर्याप्त स्मार्ट भी नहीं है।

इस प्रकार, डेटा को किसी भी तरह से बदलने की कोई कार्यक्षमता नहीं है। इसलिए यदि आप सीएसवी प्रारूप में ग्रिड डेटा प्राप्त करना चाहते हैं तो आपके पास दो विकल्प हैं:

विकल्प 1. सीएसवी क्लाइंट-साइड को सीधे अंतर्निहित data सरणी बनाकर प्रस्तुत करें। चूंकि आप पहले ही जेसन प्रारूप में डेटा लौट रहे हैं, इसलिए आप something like this के साथ इसे आसानी से करने में सक्षम होना चाहिए।

-या-

विकल्प 2. सीएसवी सर्वर साइड प्रस्तुत करें और उसे अपने review_url करने के लिए एक स्वरूपण पैरामीटर जोड़कर यूआरएल के माध्यम से सुलभ, संभव बनाते हैं।

मुझे ग्रिड में किसी भी कार्यक्षमता के बारे में पता नहीं है जो आपकी मदद करेगा, लेकिन शायद कोई मुझे सही करेगा।

0

मेरी राय में यदि आप केवल सीएसवी चाहते हैं - इसे सर्वर पर प्रस्तुत करें।
आप भी this railscasts episode दिलचस्प पाते हैं - केवल Django के लिए यह करने के लिए उपयुक्त उपकरण खोजें।

2

CSV को निर्यात के लिए आप इस सुविधा का उपयोग कर सकते हैं:

$("#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); 
     } 
    } 
}); 
+0

यह मेरे लिए बहुत अच्छी तरह से काम कर रहा है। मेरे द्वारा किए गए एक परिवर्तन को उपर्युक्त कोड के # 5 पंक्ति में था: 'var innerValue = row [j] === null || टाइपो पंक्ति [जे] == 'अपरिभाषित'? '': पंक्ति [जे] .toString(); ' – phirschybar

संबंधित मुद्दे