javascript - How to save data from HTML to excel, on click on "submit" button of form? - Stack Overflow

admin管理员组

文章数量:1392176

<form>
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="Submit">
</form>

I want onclick "submit" it should save first name and last name in Excel sheet. I don't want to use database and I don't have any server. I read somewhere that we can do the same in CSV. Help me out.

Thanks in advance.

<form>
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="Submit">
</form>

I want onclick "submit" it should save first name and last name in Excel sheet. I don't want to use database and I don't have any server. I read somewhere that we can do the same in CSV. Help me out.

Thanks in advance.

• javascript
• html
• excel

Share Improve this question Follow edited May 22, 2015 at 12:01 Darek Kay 16.8k77 gold badges6666 silver badges6262 bronze badges asked May 20, 2015 at 10:25 user2842328user2842328 1111 gold badge11 silver badge22 bronze badges 4

• Did you try anything yourself? – Maarten Peels Commented May 20, 2015 at 10:28
• No... I am not sure whether we can do so or not... And if we can do, then how... I am new to it. – user2842328 Commented May 20, 2015 at 10:38
• See this link. databison./… – Shamse Alam Commented May 20, 2015 at 10:40
• Maybe this will get you started – Maarten Peels Commented May 20, 2015 at 10:40

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 1

A possible way is to create an html table. You can set the form values into an invisible table and simulate the download of html table with a link. Excel reads the html and display the data.

---

Example :

function exportF() {
  //Format your table with form data
  document.getElementById("input").innerHTML = document.getElementById("text").value;

  var table = document.getElementById("table");
  var html = table.outerHTML;

  var url = 'data:application/vnd.ms-excel,' + escape(html); // Set your html table into url 
  var link = document.getElementById("downloadLink");
  link.setAttribute("href", url);
  link.setAttribute("download", "export.xls"); // Choose the file name
  link.click(); // Download your excel file   
  return false;
}

<form onsubmit="return exportF()">
  <input id="text" type="text" />
  <input type="submit" />
</form>

<table id="table" style="display: none">
  <tr>
    <td id="input">
    </td>
  </tr>
</table>


<a style="display: none" id="downloadLink"></a>

There are various libraries that allow the generation of .xlsx files, you will need to pick one of them (Google xlsx.js), read out the values in the form on submit and then create the spreadsheet you wish using the library you picked.

本文标签：