2016-04-15 6 views
0

У меня есть следующий код, см. Codepen http://codepen.io/Jacqueline34/pen/GZxxRV Я думаю, что в строке 25 мой код является проблемой, но я вижу, как исправить (noob alert!). Я могу правильно хранить входные данные формы в localstorage, но когда я открываю файл excel, файл показывает [object] [object] и т. Д. Как я могу изменить свой код для вывода данных localstorage в файле excel? У меня голова разбита. :)Javascript form input to csv file

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

ответ

0

Похоже, что вы записываете объекты вместо содержимого объектов.

Я изменил свой HTML немного и сделал кнопку:

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

я удалил оригинальный

$(function exportData() { } 

из кода и помещен новый вне области:

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

Я сделал измененную функцию экспорта, например, t его:

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(); 
     } 
    }  
} 

Таким образом, эта функция теперь стоит на себе. Надеюсь, это поможет ...

+0

vaultboy - Я над луной в восторге, теперь он работает. Спасибо за ваше время, отвечая на мой вопрос. Да, я загружал объекты, но я не мог видеть, как проходит мимо него. :) – Jacqueline