2

I am trying to create some editor. What it does is I have several input fields in my current site, when user enter any word , I have seperate html rendered in iframe which is hosted separately which will have some title, subtitle and few other contents . so if user types in title input field. I want to update title in rendered html page located in iframe. please share what is the proper way to setup this scenario?

Tried to manipulate using DOM id, but its not very scalable and also laggy. Currently checking websockets

enter image description here

sudhakar selva
  • 387
  • 4
  • 16

2 Answers2

0

I would assign every user an ID which is stored alongside their changes into a database. The iframe would display a php document which loads the values from the db and displays them as intended. On every change you simply reload the php with the corresponding id.

Nino
  • 13
  • 4
  • Thanks for your reply. Correct me if i am wrong.As per your suggestion, when user suppose enters text inside title input field . i have to call api on change event and update db(backend). – sudhakar selva Aug 13 '19 at 10:58
  • I trying to show preview currently.Once they clicks save button .then only I am updating in backend – sudhakar selva Aug 13 '19 at 11:01
0

In this case, the answer is here yet: Loading a string if HTML into an iframe using JavaScript

You can do it with

document.getElementById('iframe').src = "data:text/html;charset=utf-8," + escape(html);

Nino
  • 13
  • 4
  • Thanks again.Please refer attached image in the question. which is what i am trying to implement.Iframe already have src .i just want to show like preview .after saving the website can be accessed normally from URL with user edited content in it. – sudhakar selva Aug 13 '19 at 12:22
  • I would load the source of the page you want to edit into a string and into that iframe like my answer suggests. Then edit this src as text and save that to a file/database as soon as the user hits the save button. I don't think it's useful to load like an url into the iframe directly – Nino Aug 13 '19 at 14:05
  • Will try your suggestion.if that html string is complex with more editable contents i think it will be complex to search that html and updating that editable title or any. – sudhakar selva Aug 13 '19 at 15:01