¿Cómo guardar cambios en contenido HTML5 editable?

  • Autor Autor kraciboy
  • Fecha de inicio Fecha de inicio
K

kraciboy

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Buenas,

Tengo una página maquetada completamente en HTML5, lo que necesitaria es que dicha página, cuando se vea en el navegador, se pudiese modificar y se guardasen los datos sin necesidad de volcarlo a una base de datos

En HTML5 existe la opción "contenteditable", he estado mirando y he visto que hay muchas opciones de modificarlo, pero no he visto exactamente una que me deje guardar el documento y descargarlo u la otra opción es que se guarde en el servidor (cosa que dudo que pueda hacer)

¿Alguien conoce algún modo de poder llevar a cabo lo que tengo en mente?, lo único que me gustaría es que o guardase los cambios en el fichero HTML directamente o por el contrario que al menos dejase descargar el fichero con todos los cambios

Un saludo!
 
Sólo con base de datos puedes guardar los cambios, si no, puedes dejar que el usuario haga los cambios que tu quieras, usando jQuery, pero no se guardará, puedes ver un ejemplo acá: Textos - Kanikase
 
Lo debes gestionar con javascript y con algún tipo de base de datos como localStorage.

Ejemplo:

HTML: 
<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="UTF-8">
	<title>Titulo</title>
</head>
<body>
	<p contenteditable="true" id="editable">
		Aqui puede editar...
	</p>
	<script>
		var p=document.getElementById('editable');
		p.value = localStorage.getItem('editable') || '';
		p.onchange = function() {
			localStorage.setItem('editable',p.value);
		}
	</script>
</body>
</html>

Si lo que quieres es recuperar todo el html:

HTML: 
<script>
    var html = document.documentElement.innerHTML;
    // Y aquí te lo puedes enviar por Ajax o Sockets al servidor, por ejemplo.
</script>
 
Última edición:
Es decir, que no es posible realizar exactamente lo que estoy buscando por lo que veo

Aunque dicha persona se descargarse el HTML que yo le facilite y teniendolo en su equipo no podría editarlo desde el navegador con el aspecto que yo le he dado y así evitar que use un editor tipo Dreamweaver, etc...? de esta forma seria algo facil y sencillo para el usuario final

Muchas gracias por vuestra ayuda

Un saludo!
 

Con lo que te he puesto, en realidad puede editarlo en su navegador directamente en su casa. Siempre que vuelvas a guardarlo en local como document.documentElement.innerHTML;
 
Voy a ello 🙂!
 
Última edición:
Hay que estar conectado o registrado para responder aquí.
Menú
Acceder
Registro