2016-04-15 9 views
0

Ich habe den folgenden Code, siehe Codepen http://codepen.io/Jacqueline34/pen/GZxxRV Ich denke, auf der Linie 25 mein Code ist das Problem, aber ich kann sehen, wie zu korrigieren ist (noob alert!). Ich kann die Formulareingabe korrekt im lokalen Speicher speichern, aber wenn ich die Excel-Datei öffne, zeigt die Datei [Objekt] [Objekt] usw. an. Wie kann ich meinen Code ändern, um die lokalen Speicherdaten in der Excel-Datei auszugeben? Das hat meinen Kopf ruiniert. :)Javascript Eingabe in CSV-Datei

$("#save").click(function(e) {       
    e.preventDefault();         
    localStorage.setItem("user_input", "set");   
    var data = $("#contact-form").serializeArray();  
     $.each(data, function(i, obj) {     
      localStorage.setItem(obj.name, obj.value); 
     }); 
     $("#message").html("<p style='color:red'><strong>Thank you. Your information has been saved</strong></p><br/>"); 
}); 

    if (localStorage.getItem("user_input") == "set") {   
    var data = $("#contact-form").serializeArray();    
     $.each(data, function(i, obj) { 
      $("[name='" + obj.name + "']").val(localStorage.getItem(obj.name)); 
     });    
    } 

    $(function exportData() { 
    var data = $("#contact-form").serializeArray();       
     $.each(data, function(i, obj) { 
     data += $("[name='" + i + "']") + "," + $("[name='" + obj.name + "']").val(); 
     }); 
     data += '\r\n';              

     var exportLink = document.createElement('a');         
     exportLink.setAttribute('href', 'data:text/csv;base64,' + window.btoa(data)); 
     exportLink.appendChild(document.createTextNode('data.csv'));      
     document.getElementById('results').appendChild(exportLink);      
}); 

Antwort

0

Es sieht so aus, als ob Sie Objekte anstatt des Inhalts der Objekte aufschreiben.

Ich habe Ihre html ein wenig verändert und machte eine Taste:

<button id="next" type="button" class="btn btn-default" onclick="exportData()">Export</button> 

entfernt ich das Original

$(function exportData() { } 

aus dem Code und stellte einen neuen außerhalb der Umfang:

$(document).ready(function() { } 

Ich machte die geänderte Exportfunktion wie t sein:

function exportData() { 

    var data = $("#contact-form").serializeArray(); 
    var out = '';  

    for (var i = 0; i < data.length; i++) { 
     out += data[i].name + "," + data[i].value; 
     out += '\r\n'; 
    } 

    var blob = new Blob([out], { type: 'text/csv;charset=utf-8;'}); 
    if (navigator.msSaveBlob) { 
     navigator.msSaveBlob(blob, 'export.csv'); 
    } else { 
     var link = document.createElement("a"); 
     if (link.download !== undefined) { // feature detection 
      var url = URL.createObjectURL(blob); 
      link.setAttribute("href", url); 
      link.setAttribute("download", 'export.csv'); 
      link.style.visibility = 'hidden'; 
      document.body.appendChild(link); 
      link.click(); 
     } 
    }  
} 

Also diese Funktion steht jetzt auf sich. Ich hoffe es hilft ...

+0

vaultboy - Ich bin überglücklich, es funktioniert jetzt. Vielen Dank für Ihre Zeit bei der Beantwortung meiner Frage. Ja, ich habe die Objekte heruntergeladen, aber ich konnte meinen Weg nicht sehen. :) – Jacqueline

Verwandte Themen