Textareas
En primer lugar perdona que te vuelva a molestar y gracias por atender mi pregunta.
Mi duda es la siguiente: ¿Se pueden hacer textareas con javascript? ¿Cómo?, el caso es que necesito como una hilera con 3 texareas o campos de texto y cuando se pulse un botón (por ejemplo uno llamado "OTRO") me haga otra hilera de 3 textareas y así sucesivamente, he probado con un botón que llame a una función php, pero ya me he dado cuenta de que no va, porque php es del lado del servidor y no se entera de los ONCLICK, así que no m vale, y supongo que la única solución es hacer los textarea por medio de una función javascript y que el botón llame a esta función.
No se si m he explicado, espero que si, y no romperte mucho la cabeza. Si sabes otra forma de que pueda hacer esto, toda idea es bienvenida.
Mi duda es la siguiente: ¿Se pueden hacer textareas con javascript? ¿Cómo?, el caso es que necesito como una hilera con 3 texareas o campos de texto y cuando se pulse un botón (por ejemplo uno llamado "OTRO") me haga otra hilera de 3 textareas y así sucesivamente, he probado con un botón que llame a una función php, pero ya me he dado cuenta de que no va, porque php es del lado del servidor y no se entera de los ONCLICK, así que no m vale, y supongo que la única solución es hacer los textarea por medio de una función javascript y que el botón llame a esta función.
No se si m he explicado, espero que si, y no romperte mucho la cabeza. Si sabes otra forma de que pueda hacer esto, toda idea es bienvenida.
1 Respuesta
Respuesta de bubebu
1
No molestas, me alegra que vuelvas a preguntar.
Lo que pretendes hacer se puede hacer fácilmente con JavaScript usando la propiedad innerHTML de las etiquetas html.
Te voy a poner un ejemplo que muestra un botón y al pulsarle se crean 3 campos de texto, si le vuelves a pulsar aparecen otros 3, etc.
<hmlt>
<head> <title> Titulo </title>
<script>
nuevosDatos = "<br><hr><br> Texto1: <input type='text'> ";
nuevosDatos += "<br> Texto2: <input type='text'> ";
nuevosDatos += "<br> Texto3: <input type='text'> <br><hr><br>";
function masDatos() {
contenido = document.getElementById('con');
contenido.innerHTML = contenido.innerHTML + nuevosDatos
}
</script>
</head>
<body>
<form name='formulario'>
<div id='con'></div>
<input type='button' value='Mas Datos' onClick='masDatos();'>
</form>
</body>
</html>
Ahora solo tienes que adaptarlo a tu código. Si el valor de los campos de texto los vas a usar en php, sería necesario asignarles un nombre único a cada uno, no me ha dado tiempo a hacerlo, si no lo consigues hacer tu me lo dices y me pongo a ello en otro momento.
Lo que pretendes hacer se puede hacer fácilmente con JavaScript usando la propiedad innerHTML de las etiquetas html.
Te voy a poner un ejemplo que muestra un botón y al pulsarle se crean 3 campos de texto, si le vuelves a pulsar aparecen otros 3, etc.
<hmlt>
<head> <title> Titulo </title>
<script>
nuevosDatos = "<br><hr><br> Texto1: <input type='text'> ";
nuevosDatos += "<br> Texto2: <input type='text'> ";
nuevosDatos += "<br> Texto3: <input type='text'> <br><hr><br>";
function masDatos() {
contenido = document.getElementById('con');
contenido.innerHTML = contenido.innerHTML + nuevosDatos
}
</script>
</head>
<body>
<form name='formulario'>
<div id='con'></div>
<input type='button' value='Mas Datos' onClick='masDatos();'>
</form>
</body>
</html>
Ahora solo tienes que adaptarlo a tu código. Si el valor de los campos de texto los vas a usar en php, sería necesario asignarles un nombre único a cada uno, no me ha dado tiempo a hacerlo, si no lo consigues hacer tu me lo dices y me pongo a ello en otro momento.
MUCHISIMAS GRACIAS...vi q habias respondido algo tarde (ahora mismo), y ya m voy para casa, mañana probare el codigo e intentare darle un nombre unico a cada campo, ya te dire mañana como fue..
Muchísimas gracias!
Muchísimas gracias!
HOla otra vez!
Ya probé el código y VA PERFECTAMENTE es justo lo que necesitaba... GRACIAS... pero tenias razo´n, necesito que cada textarea tenga un nombre distinto, ademas el nombre deberai llevar un numero consecutivo es decir por ejemplo:
nombre1
cantidad1
abservacion1
nombre2
cantidad2
observacion2
Etc..
y obtener al final el numero al q llego, para poder recoger los datos de cada textarea en la pagina siguiente y poder insertarlos en la base de datos,. no pienses q no lo intente y pregunto sin mas, llevo todo el dia intentandolo, epro es q nunca use javascript y no fui capaz... te mando lo q intente hacer;
nuevosDatos = "<br><hr><br><span class='Estilo28'><?php echo $_SESSION['med19'];?><input name='<?php echo $_SESSION['med19'].j ;?>' type='text'> ";
nuevosDatos += " <?php echo $_SESSION['med23'];?><input type='text'> ";
nuevosDatos += " <?php echo $_SESSION['med24'];?></span><textarea cols='15' rows='4'></textarea><br><hr><br>";
function masDatos() {
var j='<?php $i ?>'
var j+=j;
contenido = document.getElementById('con');
contenido.innerHTML = contenido.innerHTML + nuevosDatos
}
La $i esta antes de llamar a esta funcoin en el código principal, inicializada a cero de la siguiente manera:
<form name='formulario'>
<?php
$i=0;
?>
<div id='con'></div>
<input type='button' value='Mas Datos' onClick='masDatos();'>
</form>
Pero claro no va... de verdad que me da mucha rabia preguntarte tanto... pero es que por mucho maual que mire...
Bueno muchas gracias, otra vez.
Un saludo
Scialfa
Ya probé el código y VA PERFECTAMENTE es justo lo que necesitaba... GRACIAS... pero tenias razo´n, necesito que cada textarea tenga un nombre distinto, ademas el nombre deberai llevar un numero consecutivo es decir por ejemplo:
nombre1
cantidad1
abservacion1
nombre2
cantidad2
observacion2
Etc..
y obtener al final el numero al q llego, para poder recoger los datos de cada textarea en la pagina siguiente y poder insertarlos en la base de datos,. no pienses q no lo intente y pregunto sin mas, llevo todo el dia intentandolo, epro es q nunca use javascript y no fui capaz... te mando lo q intente hacer;
nuevosDatos = "<br><hr><br><span class='Estilo28'><?php echo $_SESSION['med19'];?><input name='<?php echo $_SESSION['med19'].j ;?>' type='text'> ";
nuevosDatos += " <?php echo $_SESSION['med23'];?><input type='text'> ";
nuevosDatos += " <?php echo $_SESSION['med24'];?></span><textarea cols='15' rows='4'></textarea><br><hr><br>";
function masDatos() {
var j='<?php $i ?>'
var j+=j;
contenido = document.getElementById('con');
contenido.innerHTML = contenido.innerHTML + nuevosDatos
}
La $i esta antes de llamar a esta funcoin en el código principal, inicializada a cero de la siguiente manera:
<form name='formulario'>
<?php
$i=0;
?>
<div id='con'></div>
<input type='button' value='Mas Datos' onClick='masDatos();'>
</form>
Pero claro no va... de verdad que me da mucha rabia preguntarte tanto... pero es que por mucho maual que mire...
Bueno muchas gracias, otra vez.
Un saludo
Scialfa
Aquí tienes el código modificado:
<hmlt>
<head> <title> Titulo </title>
<script>
var numDatos = 1;
function masDatos() {
nuevosDatos = "<br><hr><br> Texto1: <input type='text' name='nombre" + numDatos + "'> ";
nuevosDatos += "<br> Texto2: <input type='text' name='cantidad" + numDatos + "'> ";
nuevosDatos += "<br> Texto3: <input type='text' name='observacion" + numDatos + "'> <br><hr><br>";
contenido = document.getElementById('con');
contenido.innerHTML = contenido.innerHTML + nuevosDatos + "\n";
numDatos ++;
}
</script>
</head>
<body>
<form name='formulario'>
<div id='con'></div>
<input type='button' value='Mas Datos' onClick='masDatos();'>
<input type='submit' value='Enviar'>
</form>
</body>
</html>
<hmlt>
<head> <title> Titulo </title>
<script>
var numDatos = 1;
function masDatos() {
nuevosDatos = "<br><hr><br> Texto1: <input type='text' name='nombre" + numDatos + "'> ";
nuevosDatos += "<br> Texto2: <input type='text' name='cantidad" + numDatos + "'> ";
nuevosDatos += "<br> Texto3: <input type='text' name='observacion" + numDatos + "'> <br><hr><br>";
contenido = document.getElementById('con');
contenido.innerHTML = contenido.innerHTML + nuevosDatos + "\n";
numDatos ++;
}
</script>
</head>
<body>
<form name='formulario'>
<div id='con'></div>
<input type='button' value='Mas Datos' onClick='masDatos();'>
<input type='submit' value='Enviar'>
</form>
</body>
</html>
Hola
El código que me diste va perfecto muchas gracias!... ahora estoy intentando recoger el valor de cada textarea en la siguiente página, en vez del botón submit que m dice, puse un button con window. location en el onclick , pq asi puedo pasar la variable numdatos, peor no m recoge lo de los textareas.
Tengo hechos otras páginas con textareas, pero al final del form tengo un submit y la página a la que va la pongo en el action del form. Pero aquí no lo puedo hacer así, porque necesito enviar la variable numdatos.
El caso es que no m recoge el valor de las textareas en la siguiente página, ahora mismo lo tengo así:
<form name="datos" method="POST" action="javascript:window.location.href='MED-GES-HCM-FIN.php?re=' + numdatos ">
<?php
if($_SESSION['tipo']=='C'){?>
<p align="center" class="Estilo4"><?php echo $_SESSION['med21'];?></p>
<p align="center" class="Estilo4">
<textarea name="observCons" cols="90" rows="5"></textarea>
</p><?php
} ?>
<p align="center" class="Estilo4"><?php echo $_SESSION['med16'];?></p>
<?php
$re=0;
?>
<div id='con' align="center"></div>
<p align="center"><input type='button' value='<?php echo $_SESSION['med27']; ?>' onClick='masDatos();'></p>
<?php $_SESSION['numdatos']="<script> numdatos; </script>";
?>
<p align="center"><input name="guardar" type="submit" value="<? echo $_SESSION['boton6'];?>" ></p>
</form>
Y EN LA SIGUIENTE PAGINA:
<?php
$_GET['re'];
echo "el I llego a =".$_GET['re'];
$i= $_GET['re'] ;
?>
<form name="recoge" >
<?php
for($j=1; $j<$i; $j++ ){
echo "La j es $j";
$a= "nombre$j";
echo "la a es: $a";
$b= "cantidad$j";
echo "la b es: $b";
$c= "observacion$j";
echo "la c es: $c";
echo "el normal de nombre".$_POST['$a'];
echo "el normal de cantidad".$_POST[$b];
echo "el normal de obs".$_POST[$c];
}
?>
</form>
El bucle lo hace y recoge bien re, peor no m muestra lo de las textareas, he probado: $_POST['$a'], $_POST[$a], $_POST['nombre$j'] y no va ninguna.
Muchas gracias.
El código que me diste va perfecto muchas gracias!... ahora estoy intentando recoger el valor de cada textarea en la siguiente página, en vez del botón submit que m dice, puse un button con window. location en el onclick , pq asi puedo pasar la variable numdatos, peor no m recoge lo de los textareas.
Tengo hechos otras páginas con textareas, pero al final del form tengo un submit y la página a la que va la pongo en el action del form. Pero aquí no lo puedo hacer así, porque necesito enviar la variable numdatos.
El caso es que no m recoge el valor de las textareas en la siguiente página, ahora mismo lo tengo así:
<form name="datos" method="POST" action="javascript:window.location.href='MED-GES-HCM-FIN.php?re=' + numdatos ">
<?php
if($_SESSION['tipo']=='C'){?>
<p align="center" class="Estilo4"><?php echo $_SESSION['med21'];?></p>
<p align="center" class="Estilo4">
<textarea name="observCons" cols="90" rows="5"></textarea>
</p><?php
} ?>
<p align="center" class="Estilo4"><?php echo $_SESSION['med16'];?></p>
<?php
$re=0;
?>
<div id='con' align="center"></div>
<p align="center"><input type='button' value='<?php echo $_SESSION['med27']; ?>' onClick='masDatos();'></p>
<?php $_SESSION['numdatos']="<script> numdatos; </script>";
?>
<p align="center"><input name="guardar" type="submit" value="<? echo $_SESSION['boton6'];?>" ></p>
</form>
Y EN LA SIGUIENTE PAGINA:
<?php
$_GET['re'];
echo "el I llego a =".$_GET['re'];
$i= $_GET['re'] ;
?>
<form name="recoge" >
<?php
for($j=1; $j<$i; $j++ ){
echo "La j es $j";
$a= "nombre$j";
echo "la a es: $a";
$b= "cantidad$j";
echo "la b es: $b";
$c= "observacion$j";
echo "la c es: $c";
echo "el normal de nombre".$_POST['$a'];
echo "el normal de cantidad".$_POST[$b];
echo "el normal de obs".$_POST[$c];
}
?>
</form>
El bucle lo hace y recoge bien re, peor no m muestra lo de las textareas, he probado: $_POST['$a'], $_POST[$a], $_POST['nombre$j'] y no va ninguna.
Muchas gracias.
Para pasar el dato mediante el método GET tienes que modificar el atributo action con JavaScript. El resto de los datos se pueden pasar mediante el método POST.
El código del formulario sería el siguiente:
<hmlt>
<head> <title> Titulo </title>
<script>
var numDatos = 1;
var direccion;
function masDatos() {
nuevosDatos = "<br><hr><br> Nombre" + numDatos + ": <input type='text' name='nombre" + numDatos + "'> ";
nuevosDatos += "<br> Candidad" + numDatos + ": <input type='text' name='cantidad" + numDatos + "'> ";
nuevosDatos += "<br> Observacion" + numDatos + ": <input type='text' name='observacion" + numDatos + "'> <br><hr><br>";
contenido = document.getElementById('con');
contenido.innerHTML = contenido.innerHTML + nuevosDatos + "\n";
nuevaDir = document.getElementById('datos');
numDatos ++;
nuevaDir.action = 'MED-GES-HCM-FIN.php?re=' + (numDatos-1);
}
</script>
</head>
<body>
<form name="datos" id="datos" method="POST" action="MED-GES-HCM-FIN.php">
<div id='con'></div>
<input type='button' value='Mas Datos' onClick='masDatos();'>
<input type='submit' value='Enviar'>
</form>
</body>
</html>
Un código de ejemplo para la página MED-GES-HCM-FIN.php podría ser el siguiente:
<?php
$nDatos = $_GET['re'];
echo "Se han rellenado $nDatos bloques de datos. <br><br>";
for( $i=1; $i <= $nDatos; $i++ ){
echo "<br><br> Bloque $i: <br>";
echo "<br> Nombre: " . $_POST['nombre'. $i];
echo "<br> Cantidad: " . $_POST['cantidad'. $i];
echo "<br> Observación: " . $_POST['observacion'. $i];
}
?>
El código del formulario sería el siguiente:
<hmlt>
<head> <title> Titulo </title>
<script>
var numDatos = 1;
var direccion;
function masDatos() {
nuevosDatos = "<br><hr><br> Nombre" + numDatos + ": <input type='text' name='nombre" + numDatos + "'> ";
nuevosDatos += "<br> Candidad" + numDatos + ": <input type='text' name='cantidad" + numDatos + "'> ";
nuevosDatos += "<br> Observacion" + numDatos + ": <input type='text' name='observacion" + numDatos + "'> <br><hr><br>";
contenido = document.getElementById('con');
contenido.innerHTML = contenido.innerHTML + nuevosDatos + "\n";
nuevaDir = document.getElementById('datos');
numDatos ++;
nuevaDir.action = 'MED-GES-HCM-FIN.php?re=' + (numDatos-1);
}
</script>
</head>
<body>
<form name="datos" id="datos" method="POST" action="MED-GES-HCM-FIN.php">
<div id='con'></div>
<input type='button' value='Mas Datos' onClick='masDatos();'>
<input type='submit' value='Enviar'>
</form>
</body>
</html>
Un código de ejemplo para la página MED-GES-HCM-FIN.php podría ser el siguiente:
<?php
$nDatos = $_GET['re'];
echo "Se han rellenado $nDatos bloques de datos. <br><br>";
for( $i=1; $i <= $nDatos; $i++ ){
echo "<br><br> Bloque $i: <br>";
echo "<br> Nombre: " . $_POST['nombre'. $i];
echo "<br> Cantidad: " . $_POST['cantidad'. $i];
echo "<br> Observación: " . $_POST['observacion'. $i];
}
?>
GENIAL!.. lo he probado y va perfecto.. MUCHIIIIIIIIISSSSIIIMAS GRACIAS, a este paso te acabare poniendo en el apartado de agradecimientos del proyecto... jajajaja.
Un saludo
Scialfa
Un saludo
Scialfa
