Borrar input text relacionado con checkbox al deseleccionar

[Imanol78]

Hola campeones:
Estoy realizando un formulario con un par de checkbox que activan y desactivan unos input text segun esten seleccionados o no. El asunto es que va de maravilla, y al seleccionar, efectivamente los input se activan y permiten introducir datos.
El "pero" viene cuando el usuario decide no incluir más datos (por equivocación, o por decisión/indecisión) y deselecciona el checkbox. LOS DATOS SIGUEN ESCRITOS.
He buscado y rebuscado pero no se como hacer para que al deseleccionar se borren los datos.

Dejo una parte del codigo:

Código PHP:

  <input name="añade1" type="checkbox" id="añade1" onClick="document.forms['comunicaciones']['apellido1b'].style.visibility =(this.checked)?'visible':'hidden';document.forms['comunicaciones']['apellido2b'].style.visibility =(this.checked)?'visible':'hidden';document.forms['comunicaciones']['nombreb'].style.visibility =(this.checked)?'visible':'hidden'"></td>  
      <td class="texto"> 
        <input name="apellido1b" type="text" id="apellido1b" size="18" style="visibility: hidden;">      </td> 
        <td class="texto"> 
        <input name="apellido2b" type="text" id="apellido2b" size="18" style="visibility: hidden;"> 
      </td> 
      <td class="texto"> 
        <input name="nombreb" type="text" id="nombreb" size="15" style="visibility: hidden;">  
   

Gracias por adelantado al que se anime a responder con algo de ayuda
Un saludo

[gjx2]

Código HTML:

<script>
    
function seleccionar(){
    
    var chk = document.getElementById('añade1');
        
        if(chk.checked){
                rese();
            document.getElementById('Inputs').style.display='none';
        }
        else
        {
        document.getElementById('Inputs').style.display='block';
        }
 
    }
 
 
    function rese(){
        
        document.getElementById('apellido1b').value = "";
        document.getElementById('apellido2b').value = "";
        document.getElementById('nombreb').value = "";
    }
 
</script>
 
 
 
<form name="comunicaciones">
<input name="añade1" type="checkbox" id="añade1" onClick="seleccionar()">  
      <div id="Inputs">
    
        <input name="apellido1b" type="text" id="apellido1b" size="18" >      
        <input name="apellido2b" type="text" id="apellido2b" size="18"> 
        <input name="nombreb" type="text" id="nombreb" size="15"> 
       
       </div>
       
       </form>
 

[Imanol78]

Mil gracias por tu RRRRRRRapidez!!
PERO lo he probado y no funciona.
Veamos:
Primero tengo un checkbox que activa o desactiva la visibilidad de varios checkbox más.

Código PHP:

  <span class="texto">Añadir autores </span><input id="activar" type="checkbox" class="switch-datos"/>  
   

y más tarde tengo los checkbox que activan o desactivan los input apellido1b, apellido2b y nombre

Código PHP:

  2 <input name="añade1" type="checkbox" id="añade1" onClick="document.forms['comunicaciones']['apellido1b'].style.visibility =(this.checked)?'visible':'hidden';document.forms['comunicaciones']['apellido2b'].style.visibility =(this.checked)?'visible':'hidden';document.forms['comunicaciones']['nombreb'].style.visibility =(this.checked)?'visible':'hidden'"></td>  
      <td class="texto"> 
        <input name="apellido1b" type="text" id="apellido1b" size="18" style="visibility: hidden;">      </td> 
        <td class="texto"> 
        <input name="apellido2b" type="text" id="apellido2b" size="18" style="visibility: hidden;"> 
      </td> 
      <td class="texto"> 
        <input name="nombreb" type="text" id="nombreb" size="15" style="visibility: hidden;">  
   

He probado a incluir la función entre los script que tengo y llamar tal y como me comentas pero falla.

Insisto en que tan solo necesito que en el caso de que se desactive el segundo checkbox, los input apellido1b, apellido2b y nombre queden en blanco.

De todas formas, gracias otra vez por la pronta respuesta.

¿¿¿A alguien se le ocurre alguna otra forma???

Un saludo

[turfeano]

Esto debe ir a Javascript...

Código:

<script type="text/javascript">
function cambiar_estados(check){
if (check.checked == true){
	document.getElementById('apellido1b').style.visibility = "visible";
	document.getElementById('apellido2b').style.visibility= "visible";
	document.getElementById('nombreb').style.visibility= "visible";
}
}
</script>

<input name="añade1" type="checkbox" id="añade1"  onclick="cambiar_estados(this)"  /></td>  
      <td class="texto"> 
        <input name="apellido1b" type="text" id="apellido1b" size="18" style="visibility: hidden;" />      </td> 
        <td class="texto"> 
        <input name="apellido2b" type="text" id="apellido2b" size="18" style="visibility: hidden;" /> 
      </td> 
      <td class="texto"> 
        <input name="nombreb" type="text" id="nombreb" size="15" style="visibility: hidden;" />

[GatorV]

Tema trasladado desde PHP

[Imanol78]

Gracias por la segunda respuesta, y gracias también al moderador por estar tan atento. En principio creí que existia alguna sentencia en php que pudiera responder al tema.

Respecto a las propuestas, he probado la segunda, y funciona en parte para lo que quiero, pero solo es una alternativa (seguramente mejor que la que yo he planteado) para hacer aparecer y desaparecer los input text.

A pesar de ello, no realiza la acción de borrado y en IE8 la página se carga con errores (error de sentencia).

Seguiré buscando la opción más acercada

Gracias de nuevo.

Un saludo

[JavierB]

Hola Imanol78

Código javascript:

<html>
<head>
<script type="text/javascript">
function ver(chk) {
  obj=chk.form;
  obj.apellido1b.style.visibility = (chk.checked) ? 'visible' : 'hidden';
  obj.apellido2b.style.visibility = (chk.checked) ? 'visible' : 'hidden';
  obj.nombreb.style.visibility = (chk.checked) ? 'visible' : 'hidden';
  if (chk.checked) {
    obj.apellido1b.value='';
    obj.apellido2b.value='';
    obj.nombreb.value='';
  }
}
</script>
</head>
<body>
<form>
<input name="añade1" type="checkbox" id="añade1" onclick="ver(this)"></td> 
      <td class="texto">
        <input name="apellido1b" type="text" id="apellido1b" size="18" style="visibility: hidden;">      </td>
        <td class="texto">
        <input name="apellido2b" type="text" id="apellido2b" size="18" style="visibility: hidden;">
      </td>
      <td class="texto">
        <input name="nombreb" type="text" id="nombreb" size="15" style="visibility: hidden;">
</form>  
</body>
</html>
 

Saludos,

[Imanol78]

Muchas gracias por la respuesta.
Ya tengo el formulario publicado y en funcionamiento y de momento viene toda la información bien. He utilizado el código que yo tenía publicado.
Algo que me deja asombrado es la cantidad de ayuda que se recibe desde este foro. ¡Increible la participación de la gente como vosotros!
Un abrazo