how to save a value from textarea to a blank file?

Question

I'm making a webpage wherein a user can make his/her own functions, then those functions will become like an option to the side of the webpage so when they are click/selected they can be used. Here's the flow

1. User creates function written in js
2. when save button is click it will automatically be save to Savedfunction.js file
3. the created function will be called as a checkbox so that it can be use

Here's a picture to further elaborate the problem:

Answer 1

First of all javascript can't save files on you computer (except you use ie). security,privacy...

---

If you want to let the user download his created file:

Chrome has the new download attribute but it works also on other brosers without the download attribute.

var txt='var x = 3,lol=fun;';

function dl(data,filename){
 var b=document.createElement('a');
 b.download=filename;
 b.textContent=filename;
 b.href='data:application/json;base64,'+
 window.btoa(unescape(encodeURIComponent(data)));
 return b
}

document.body.appendChild(dl(txt,'my.js'));

DEMO

http://jsfiddle.net/8yQcW/

in the comment is also a link for automatic download.

---

Want to save the data on your server:

note:if you want to save the function to the server you need a server language like php

<?php
if($_POST['fn']&&$_POST['data']){
 $fh=fopen($_POST['fn'],'w') or die("can't open file");
 if(fwrite($fh,$_POST['data'])){
  echo '["ok":"file saved"]';// maybe return the saved code.
  //echo json_encode($_POST);
 }else{
  echo '["error":"can\'t save the file"]';
 }
 fclose($fh);
}
?>

---

Want to save the data only on the users computer (using modern web technologies?)

you can also store the data inside (clientSide):

window.localStorage
window.sessionStorage

webSQL

indexedDB

---

Want to execute the script from it's string?

don't use eval();

use:

 var js="var x='hey';alert(x);"
 (new Function(js))()

---

To achieve what you need you need to mix this technologies.

if you have any other questions just ask.

Answer 2

You can do the a kind of trick, (the concept):

1. Add a code in php, or some other server side.
2. Post the script to the server side (POST method is the preffered one).
3. On the server side, write the whole page with the script - the php page will be with the javascript.
4. Redirect to the new page (the php/asp, or whatever best fit your needs).

Good luck !!!

Answer 3

Javascript can't write directly to the file system (unless you use a windows HTA application, running HTML/javascript - then special file system objects become available in IE). If this is appropriate, have a look here : Microsoft FileSystemObject

Assuming it's a traditional web page, it'll need to save the resulting javascript to the Savedfunction.js file.

That's just a text file, so you could have ..

• User adds new javascript as simple text in a textarea on your web page.

• When the user commits the new function (ie clicks 'save' or whatever), submit the HTML form to the server.

• Have the recieving script on server amend the file and add it to the js file

That is : A normal submit process, just appending to a file, which happens to be a javascript file. If any need parameters, then you might also need to keep a list of functions generated and the text of a legitemate call to them- otherwise how can the user (or web page) know how to use them ?

To view the javascript functions available, open the web page which reads (via server script) your js file for data on what to present ain the menu options, and also include the js file as a script so that clicking the right option runs the right javascript routine.

As for syntax checking when you submit the javascript .. I'll leave that bit up to you ! I guess you could use window.eval (wrapped in try .. catch block) to see if it compiled before submitting.