Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can JavaScript save to a local file?

Tags:

There's already a solution for writing file JSON online but I want to save json file locally. I've tried to use this example http://jsfiddle.net/RZBbY/10/ It creates a link to download the file, using this call a.attr('href', 'data:application/x-json;base64,' + btoa(t.val())).show(); Is there a way to save the file locally instead of providing a downloadable link? There are other types of conversion beyond data:application/x-json;base64?

Here's my code:

<!DOCTYPE html> <head>      <meta charset="utf-8">     <title>jQuery UI Sortable - Default functionality</title>      <link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css">     <script src="http://jqueryui.com//jquery-1.7.2.js"></script>     <script src="http://jqueryui.com/ui/jquery.ui.core.js"></script>     <script src="http://jqueryui.com/ui/jquery.ui.widget.js"></script>     <script src="http://jqueryui.com/ui/jquery.ui.mouse.js"></script>     <script src="http://jqueryui.com/ui/jquery.ui.sortable.js"></script>         <script src="http://jqueryui.com/ui/jquery.ui.accordion.js"></script>     <link rel="stylesheet" href="http://jqueryui.com/demos/demos.css">             <meta charset="utf-8">     <style>a { font: 12px Arial; color: #ac9095; }</style> <script type='text/javascript'> $(document).ready(function() { var f = $('form'), a = $('a'),     i = $('input'), t = $('textarea');         $('#salva').click(function() {     var o = {}, v = t.val();          a.hide();//nasconde il contenuto     i.each(function() {      o[this.name] = $(this).val(); });     if (v === '') {         t.val("[\n " + JSON.stringify(o) + " \n]")              }     else {         t.val(v.substr(0, v.length - 3));         t.val(t.val() + ",\n " + JSON.stringify(o) +  " \n]")       } }); });  $('#esporta').bind('click', function() {     a.attr('href', 'data:application/x-json;base64,' + btoa(t.val())).show();          }); </script> </head> <body>     <form>         <label>Nome</label> <input type="text" name="nome"><br />         <label>Cognome</label> <input type="text" name="cognome">         <button type="button" id="salva">Salva</button>     </form>              <textarea rows="10" cols="60"></textarea><br />     <button type="button" id="esporta">Esporta dati</button>     <a href="" style="display: none">Scarica Dati</a> </body> </html> 
like image 651
Mirko Cianfarani Avatar asked Jun 17 '12 13:06

Mirko Cianfarani


People also ask

Can JavaScript load local file?

JavaScript cannot typically access local files in new browsers, but the XMLHttpRequest object can be used to read files. So it is actually Ajax (and not Javascript) which is reading the file.

Can JavaScript interact with local files?

JavaScript does not have direct access to the local files due to security and privacy. We can offer the user the possibility to select files via a file input element that we can then process. The file input has a files property with the selected file(s).

Where is JavaScript saved?

JavaScript files are stored on the server and sent to the browser. Only the browser does something with the code.


1 Answers

Based on http://html5-demos.appspot.com/static/a.download.html:

var fileContent = "My epic novel that I don't want to lose."; var bb = new Blob([fileContent ], { type: 'text/plain' }); var a = document.createElement('a'); a.download = 'download.txt'; a.href = window.URL.createObjectURL(bb); a.click(); 

Modified the original fiddle: http://jsfiddle.net/9av2mfjx/

like image 123
Stanislav Avatar answered Oct 21 '22 07:10

Stanislav