How to save a file with contenteditable elements preserving the editable content?
I have a HTML page with an element having the contenteditable attribute set to true. I can edit the page, but I can not save the page. Whatever I enter into the element does not get saved to the file.
Example:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<div contenteditable="true" style="min-width: 20ch">
initial value
</div>
</body>
</html>
"Open file", modify the text, "Save as" => modifications are lost
But Chrome does it as expected. The saved file contains the modification.
Modified by ceving
All Replies (5)
Nobody here?
Ok.......... The W3C.org sets the standards and practices and future for web browsers and web pages. If you run your code through these online programs then your pages will show up in any browser as perfect, A 100 browsers out there so.. Also your Google Page Rank will be great.
Can upload a page or give it a URL
So HTML https://validator.w3.org/
CSS https://jigsaw.w3.org/css-validator/
Unicorn https://validator.w3.org/unicorn/
Above for your info.
So I can do nothing with the info.
You want to file a bug report ? file a bug report. https://bugzilla.mozilla.org/ Bug Writing Guidelines : https://developer.mozilla.org/en-US/docs/Mozilla/QA/Bug_writing_guidelines
Would be good that you do. Should explore as what you are trying to set should it not be in a CSS file instead.
I copied what you had there into a notepad, saved as html, Error Element head is missing a required instance of child element title.
From line 5, column 6; to line 5, column 12 8"/>↩ </head>↩ Content model for element head: If the document is an iframe srcdoc document or if title information is available from a higher-level protocol: Zero or more elements of metadata content, of which no more than one is a title element and no more than one is a base element. Otherwise: One or more elements of metadata content, of which exactly one is a title element and no more than one is a base element.
So check and double check, that could be why it is not saving and what program are you using to save this with. If just Firefox....... and Blue Griffin. Why are you not using the Developer Edition https://www.mozilla.org/en-US/firefox/developer/
Please let us know if this solved your issue or if need further assistance.
Modified by Shadow110
Pkshadow said
Ok.......... The W3C.org sets the standards and practices and future for web browsers and web pages. If you run your code through these online programs then your pages will show up in any browser as perfect, A 100 browsers out there so.. Also your Google Page Rank will be great. Can upload a page or give it a URL So HTML https://validator.w3.org/ CSS https://jigsaw.w3.org/css-validator/ Unicorn https://validator.w3.org/unicorn/ Above for your info. So I can do nothing with the info. You want to file a bug report ? file a bug report. https://bugzilla.mozilla.org/ Bug Writing Guidelines : https://developer.mozilla.org/en-US/docs/Mozilla/QA/Bug_writing_guidelines Would be good that you do. Should explore as what you are trying to set should it not be in a CSS file instead. I copied what you had there into a notepad, saved as html, Error Element head is missing a required instance of child element title. From line 5, column 6; to line 5, column 12 8"/>↩ </head>↩ Content model for element head: If the document is an iframe srcdoc document or if title information is available from a higher-level protocol: Zero or more elements of metadata content, of which no more than one is a title element and no more than one is a base element. Otherwise: One or more elements of metadata content, of which exactly one is a title element and no more than one is a base element. So check and double check, that could be why it is not saving and what program are you using to save this with. If just Firefox....... and Blue Griffin. Why are you not using the Developer Edition https://www.mozilla.org/en-US/firefox/developer/ Please let us know if this solved your issue or if need further assistance.
Talks a bot to me? Nothing in the above answer is related to my question, why modifications to editable elements are lost, when the modified page gets saved. I feel kidded by the question if this solves my issue.
It was info. As was where/how to file a bug report. Putting it here is not going to do anything. So thanks for the info.
Is there anything else that can help you with that is not associated to the above ?
ceving said
I have a HTML page with an element having the contenteditable attribute set to true. I can edit the page, but I can not save the page. Whatever I enter into the element does not get saved to the file. "Open file", modify the text, "Save as" => modifications are lost But Chrome does it as expected. The saved file contains the modification.
Firefox has never worked like that. I suspect the "problem" is that Firefox has needed a JavaScript bookmarklet like this to trigger contentEditable for Gecko to go into "contentEditable" mode. I don't think that can be triggered from the web-side - but I'm not a programmer.
javascript:document.body.contentEditable%20=%20'true';%20document.designMode='on';%20void%200
Plus Firefox / Gecko has always needed an editable file to be opened outside of Firefox in order that the edits be saved.
That said, the situation may be changed a bit in Quantum, or may change "down the road" as more of the old Gecko code is replaced. I just don't know what the situation for "contentEditable" is now and will be "down the road".
Best I can suggest is to see this KB page: Where to go for developer support