Quitar elemento o recargar página

marcospuig · #1 (**permalink**) 20/07/2007, 02:45

¿Como puedo 'quitar' un elemento de una página cuando se pulse en un botón 'borrar' q corresponde a ese elemento o recargar la página sin mostrar ese elemento?

Os explico, tengo una serie de elementos, por ejemplo titulaciones univeristarias (no es más que un input con el nombre de la titulación) ya creados por el usuario y a su vez el usuario puede crear nuevas titulaciones (eso lo tengo hecho, lo consigo con javascript) pero el usuario también tiene que poder editar las titulaciones ya existentes (también hecho, modifica el input y se acabó) aunque el problema viene cuando el usuario quiere eliminar una de las titulaciones que ya tenía creadas (esto es lo que no sé como hacer, si hay alguna forma de 'quitar' esa titulación o es mejor recargar la página, y si hay que recargarla ¿cómo se recarga?).

Muchas gracias

caricatos · #2 (**permalink**) 20/07/2007, 03:02

Hola:

Recargar la página tal vez no sea una buena idea, ya que se podrían perder cambios importantes

Para borrar un elemento con el DOM se utiliza el método removeChild... en las FAQs hay alguna pista, pero básicamente para borrar un botón desde el propio botón la sintaxis sería:

onclick="this.parentNode.removeChild(this)"

Saludos

marcospuig · #3 (**permalink**) 20/07/2007, 03:13

No, pero yo no quiero borrar el mismo botón:
Este es el código, y lo que quiero borrar, la titulación está en rojo y a contunuación, también en rojo aparece el botón para borrar esa titulación:

Código:

<html>
<head>
<title>Datos Profesor</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>

<?

include("conexion.php");


$sql1 = "select * from titulaciones where DNIProfesor = '".$fila['DNI']."'";
$result1 = mysql_query($sql1, $GLOBALS["miConexion"]) or die(mysql_error());
//Consulta que daría las titulaciones creadas con anterioridad para este `profesor (el DNI vendría por la url, no lo pongo para simplificar el código)

echo '<form name="f" id="f1" method = "POST" action ="guardarProfesor.php" OnSubmit="return validar(this)">';
echo  '<div style="margin-left: 3%; width=200px;">
        Nombre: <input name="cNombre" type="text" value="'.$fila['nombre'].'">
       
        <strong>Titulaciones del profesor</strong>            <br><br>';
$sql1 = "select * from titulaciones where DNIProfesor = '".$fila['DNI']."'";
$result1 = mysql_query($sql1, $GLOBALS["miConexion"]) or die(mysql_error());

$i=0;
while ($fila1= mysql_fetch_assoc($result1)){
        echo'
                - <input name="cNombreTitulacion'.$i.'" type="text" size="40" value="'.$fila1['nombreTitulacion'].'">
                ';
	&nbsp&nbsp&nbsp&nbsp <a href="editarDatosProfesor.php"><input name="botonBorrar" type="button" value="Borrar"></a>

                $_SESSION['nTitulacion'.$i]=$fila1['nTitulacion'];
        $i++;
}       
       

echo'
<input type="button" value="Añadir titulación" onclick="crearTitulacion(this)">';

<input name="botonGuardar" type="submit" value="Guardar">
</form>';
?>
</body>
</html>

caricatos · #4 (**permalink**) 20/07/2007, 03:29

Hola:

Si puedes ponle un id (por supuesto que sea único, y al boton pon algo así como onclick="borrar(id)" ) con el id que has creado, y la función borrar se quedaría:

function borrar(id) {
elemento = document.getElementById(id);
elemento.parentNode.removeChild(elemento);
}

Y luego si tienes que borrar el propio botón (supongo) en el propio onclick de tu botón puedes añadir lo que puse en el otro mensaje separado por un punto y coma.

Saludos

marcospuig · #5 (**permalink**) 20/07/2007, 03:46

Lo he probado y no me funciona, el código con el que estoy probando quedaría así:

Código:

<html>
<head>
<title>Datos Profesor</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<script language="JavaScript">
function borrarTitulacion(id) {
elemento = document.getElementById(id);
elemento.parentNode.removeChild(elemento);
}


</script>


<?

include("conexion.php");


$sql1 = "select * from titulaciones where DNIProfesor = '".$fila['DNI']."'";
$result1 = mysql_query($sql1, $GLOBALS["miConexion"]) or die(mysql_error());
//Consulta que daría las titulaciones creadas con anterioridad para este `profesor (el DNI vendría por la url, no lo pongo para simplificar el código)

echo '<form name="f" id="f1" method = "POST" action ="guardarProfesor.php" OnSubmit="return validar(this)">';
echo  '<div style="margin-left: 3%; width=200px;">
        Nombre: <input name="cNombre" type="text" value="'.$fila['nombre'].'">
       
        <strong>Titulaciones del profesor</strong>            <br><br>';
$sql1 = "select * from titulaciones where DNIProfesor = '".$fila['DNI']."'";
$result1 = mysql_query($sql1, $GLOBALS["miConexion"]) or die(mysql_error());

$i=0;
while ($fila1= mysql_fetch_assoc($result1)){
        echo'
                - <input name="cNombreTitulacion'.$i.'" type="text" size="40" value="'.$fila1['nombreTitulacion'].'">
                ';
	echo'		&nbsp&nbsp&nbsp&nbsp <input name="botonBorrar" type="button" id="Btit'.$i.'" value="Borrar" onclick="borrarTitulacion("tit'.$i.'")">';


                $_SESSION['nTitulacion'.$i]=$fila1['nTitulacion'];
        $i++;
}       
       

echo'
<input type="button" value="Añadir titulación" onclick="crearTitulacion(this)">';

<input name="botonGuardar" type="submit" value="Guardar">
</form>';
?>
</body>
</html>

Gracias

caricatos · #6 (**permalink**) 20/07/2007, 04:10

Hola:

No veo que al control le hayas puesto un id...

<input name="botonBorrar" type="button" id="Btit'.$i.'" value="Borrar" onclick="borrarTitulacion("tit'.$i.'")">';

<input name="cNombreTitulacion'.$i.'" type="text" size="40" value="'.$fila1['nombreTitulacion'].'" id="tit'.$i.'">

Insisto en que procures poner solo cósdigo fuente (desde el navegador "ver código fuente")

Saludos

marcospuig · #7 (**permalink**) 20/07/2007, 04:21

Uff, se me habia olvidado copiarlo aqui, pero sí tenía puesto el id, esa línea quedaría asi (todo lo de más igual):

Código PHP:

  echo' - <input name="cNombreTitulacion'.$i.'" id="tit'.$i.'" type="text" size="40" value="'.$fila1['nombreTitulacion'].'">';

Pero no me hace nada, no me ejecuta nada, es más, he puiesto un alert en borrarTitulacion y no llega allí, no me sale nada por pantalla

caricatos · #8 (**permalink**) 20/07/2007, 04:45

Hola:

Por eso insisto en que pongas "código fuente" :ènsando:

Posiblemente hayas puesto mal el código desde php...

Saludos

marcospuig · #9 (**permalink**) 20/07/2007, 05:05

Este ves el código fuente:

Código:

<html>
<head>
<title>Datos Profesor</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>



 
<script language="JavaScript">
function borrarTitulacion(id) {
alert('hola');
elemento = document.getElementById(id);
elemento.parentNode.removeChild(elemento);
}


</script>




<form name="f" id="f1" method = "POST" action ="guardarProfesor.php" OnSubmit="return validar(this)">
  <h2>Datos del profesor Marcos Puig Pérez</h2><div style="margin-left: 3%; width=200px;"> 
    DNI: <input name="cDNI" type="text" value="48922405w">
	<br><br>

	Nombre: <input name="cNombre" type="text" value="Marcos">
	&nbsp&nbsp Primer apellido: <input name="cApellido1" type="text" value="Puig">
	&nbsp&nbsp Segundo apellido: <input name="cApellido2" type="text" value="Pérez">  
	<br><br>
	Dirección: <input name="cDireccion" type="text" size="40" value="C/Punta Umbria nº 15 2º2">
	&nbsp&nbsp Teléfono: <input name="cTelefono" type="text" value=667316703>

    <br><br>
	
	<strong>Titulaciones del profesor</strong>		<br><br>
		- <input name="cNombreTitulacion0" id="tit0" type="text" size="40" value="Ingeniero Técnico en Informática de Gestión">		&nbsp&nbsp&nbsp&nbsp <input name="botonBorrar" type="button" id="Btit0" value="Borrar" onclick="borrarTitulacion("tit0")">
		<br><br>
		- <input name="cNombreTitulacion1" id="tit1" type="text" size="40" value="Licenciado en Informática">		&nbsp&nbsp&nbsp&nbsp <input name="botonBorrar" type="button" id="Btit1" value="Borrar" onclick="borrarTitulacion("tit1")">

		<br><br>
		- <input name="cNombreTitulacion2" id="tit2" type="text" size="40" value="CAP">		&nbsp&nbsp&nbsp&nbsp <input name="botonBorrar" type="button" id="Btit2" value="Borrar" onclick="borrarTitulacion("tit2")">
		<br><br>
		- <input name="cNombreTitulacion3" id="tit3" type="text" size="40" value="DEI">		&nbsp&nbsp&nbsp&nbsp <input name="botonBorrar" type="button" id="Btit3" value="Borrar" onclick="borrarTitulacion("tit3")">
		<br><br>
<input type="button" value="Añadir titulación" onclick="crearTitulacion(this)">

<input name="nTitulacionesCreadas" type="hidden" value=""><br><br>Dedicación:<br><br>
    <input type="radio" name="cDedicacion" value="valorTotal" checked>Total</label>&nbsp&nbsp<label>
    <input type="radio" name="cDedicacion" value="valorParcial" >Parcial</label><br><br><br>  
	Otras actividades: <br>
	<textarea name="cOtrasActividades" cols="40" rows="4">Imparte el curso Aplicaciones Informáticas de Gestión en Escacena del Campo</textarea><br><br>  
	
	<input name="cDirector" type="checkbox" value="valorDirector" > Director
	&nbsp;&nbsp;<input name="cSubdirector" type="checkbox" value="valorSubdirector" > Subdirector
	&nbsp;&nbsp;<input name="cTutor" type="checkbox" value="valorTutor" checked> Tutor
	&nbsp;&nbsp;<input name="cJefeSeccion" type="checkbox" value="valorJefeSeccion" > Jefe sección
	&nbsp;&nbsp;<input name="cOrientador" type="checkbox" value="valorOrientador" checked> Orientador
	&nbsp;&nbsp;<input name="cRape" type="checkbox" value="valorRape" > RAPE
	<br><br>

<center>
<input name="botonGuardar" type="submit" value="Guardar">
</center>
</form>
</body>
</html>

caricatos · #10 (**permalink**) 20/07/2007, 08:18

Hola:

Esto no está bien:

Código:

onclick="borrarTitulacion("tit0")">

Estás generando un código que no es válido, porque no alternas las comillas... dentro de unas comillas dobles solo valen comillas simples, o ponerlas con una barra delante... pero ante la duda te recomiendo que uses otra sintaxis php para los "echo"'s... (no me acuerdo como se llama)

Código:

echo <<< otraSintaxis

onclick="borrarTitulacion('tit0')"

otraSintaxis;

Saludos