Foros del Web - Ver Mensaje Individual

emprear · #4 (**permalink**) 31/07/2012, 22:46

Creo que construyendo los forms directamente para presentar las noticias te sería más sencillo

Código HTML:

Ver original<!DOCTYPE html>
<html lang="es-ar">
<head>
<meta charset="utf-8" />
<title>Html5</title>
 
<style type="text/css">
/*<![CDATA[*/
 
input.noticias{
width: 400px;
border: none;
margin-bottom: 5px;
font-weight: bold;
font-size: 14pt;
}
textarea.noticias{
width: 400px;
height: 70px;
border: none;
margin-bottom: 5px;
}
 
/*]]>*/
</style>
<script type="text/javascript">
//<![CDATA[
function editar(noti){
var idnoticia = noti.split('_');
var tit = 'titulo'+idnoticia[1];
var cont = 'contenido'+idnoticia[1];
var bot = 'botones'+idnoticia[1];
var tit_original = document.getElementById(tit).value;
var cont_original = document.getElementById(cont).value;
document.getElementById(tit).readOnly = false;
document.getElementById(tit).style.backgroundColor = '#9DC864';
document.getElementById(cont).readOnly = false;
document.getElementById(cont).style.backgroundColor = '#73C567';
document.getElementById(cont).style.overflow = 'auto';
document.getElementById(bot).style.display = 'inline-block';
}
//]]>
</script>
</head>
<body>
 
<h1>Noticias</h1>
<div id="contenedor_noticias">
<form action="#">
<input class="noticias" type="text" name="titulo" id="titulo1" readonly="readonly" value="Título Noticia 1"><br />
<textarea cols="10" rows="10" class="noticias" style="overflow: hidden;" name="contenido" id="contenido1" readonly="readonly">Contenido noticia 1</textarea><br />
<input type="button" onclick="editar('noticia_1')" value="Editar" /> <span id="botones1" style="display: none;">
<input type="button" onclick="cancelar('noticia_1')" value="Cancelar" /> 
<input type="button" onclick="guardar('noticia_1')" value="Guardar" /> </span> 
<input type="button" onclick="eliminar('noticia_1')" value="Eliminar" /> 
</form>
</div>
</body>
</html>

Para cancelar, guardar, eliminar, utilizás ajax
cancelar:
recuperás el texto original y lo pones en el titulo y contenido correspondiente al id de la noticia
guardar: guardás en la base de datos y restableces el readonly y ocultás los botones
Eliminar: borrás de la base de datos y le hacés innerHTML = ""; al contenedor individual de la noticia

SAludos