0

The title probably isn't great but there isn't an easy way to explain what I am trying to do.

I have a div with Content editable enabled. I want to make is so that any text written will be saved. I don't want to use localStorage but want to just directly save the text in the html file. I'm not sure if this is possible and I have looked for anything similar and wasn't able to find anything.

STOAM
  • 95
  • 6
  • Please explain further your use case. "just directly save the text in the html file" has no clear sense: what if the user reloads the page? The page comes from your server and your server does not know about what has been typed in the page. – sjahan Apr 03 '19 at 08:28
  • @sjahan I'm using the div with content editable enabled to act like a paragraph. To let people type words. Then I want to save that permanently in the HTML file for the page. – STOAM Apr 03 '19 at 08:32
  • Ok, but still it doesn't make a lot of sense: where do you want to save it? Either you save it on your server/backend, either you save it on the user's computer. But if you want to save it on the user's computer, you don't have a lot of options, and localStorage is definitely the simplest way to go. You can try the File API too, but that's clearly more complex. – sjahan Apr 03 '19 at 08:53
  • @sjahan What I'm trying to do is, image you have for example

    Hello

    I want to be able to edit that in the browser using contentEditable. Then have that save what ever I have changed in the HTML file, so then in the file the edits appear as

    I have edited this

     – STOAM Apr 03 '19 at 09:05
  • Still, you do not answer the question: where do you want to save the content? First, do you want that all of your users see the same thing? Do you want the content to be user-specific? – sjahan Apr 03 '19 at 09:25
  • @sjahan the website is only being built for 2 users, so I just want straight edits on the html file, the content should be visible and editable by both users. – STOAM Apr 03 '19 at 10:34
  • If the information needs to be shared among users, then, it means you want to save it on the server-side. Do as Ulysse BN told: send the content through an HTTP request and save it on your server. You'll need to implement something on the server-side tho. – sjahan Apr 03 '19 at 11:05

1 Answers1

2

No: it is not possible to edit the files you serve to users using only front-end specific technologies. It would be very dangerous.

However, you could trigger an event on text modification and then send changes information to you back-end. There you would have to do some logic to ensure next loading will contain the data changed by your user.

Ulysse BN
  • 10,116
  • 7
  • 54
  • 82
  • So there is no vanilla way to save changes. Do you know any back end applications I could use? – STOAM Apr 03 '19 at 08:29
  • It is a completely different paradigm than static front-end apps. If you've never worked on a server I'd suggest something new and easy such as NodeJS, Ruby on Rails, on Django (Python). However, this depends on a lot of stuff and you should look more at what are your needs to answer correctly that question! – Ulysse BN Apr 03 '19 at 08:31
  • I'm really just trying to find a way to set up a simple chat board. My website is just going to be hosted on a basic xampp server. I'm pretty new to JS and I don't really want to mess around with any extra backend software. – STOAM Apr 03 '19 at 08:36
  • Some rule of thumb you can use is that if you have no interaction with a server, you have no way to persist or share any content between clients. You can only persist for a single client (`localStorage`), and share between windows of the same client (using new window inside your app, I have http://github.com/buonomo/kazoo app as example). – Ulysse BN Apr 03 '19 at 08:48
  • Is there a way to use localStorage functions but have the file where localStorage is storing the data in a file that is in a folder of my choice – STOAM Apr 03 '19 at 09:03