JavaScript - Ayuda para armar un a href tomando un valor de un input text

 
Vista:
sin imagen de perfil

Ayuda para armar un a href tomando un valor de un input text

Publicado por Jose (4 intervenciones) el 06/06/2017 21:09:37
Saludos a todos, me encuentro programando con php y html, desconozco mucho de javascript, pero requiero armar un enlace dinámico como sigue:

1) Del valor introducido por el usuario acá:

1
2
3
<input type="text" name="txt_nick" id ="txt_nick" maxlength="50" style="width:100%;"
alt="P. Ejem. 12345678" placeholder="Identificación "
value="<?php echo (isset($_GET['lgn'])? $_REQUEST['lgn'] :''); ?>" autofocus="autofocus" required>

2) Debo armar al momento de hacer click en el enlace (de manera dinámica) algo como:

1
<a href="cambiaclav.php?usr= ****valor leido del <input type="text" ** > Cambiar clave</a>

Se que no puedo hacerlo con php por ser un lenguaje para programación del lado del servidor.

Gracias por cualquier ayuda al respecto.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de kip
Val: 553
Bronce
Ha aumentado 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Ayuda para armar un a href tomando un valor de un input text

Publicado por kip (107 intervenciones) el 06/06/2017 21:31:57
Hola, algo asi puede servirte:

1
2
3
4
5
link = document.querySelector('#cambia_clave');
link.addEventListener('click', function(e) {
    valor = document.querySelector('#txt_nick').value;
    this.href = this.href + valor;
});


Solo recuerda darle un id a tu elemento <a>:
1
<a href="cambiaclav.php?usr=" id="cambia_clave"> Cambiar clave</a>

Yo le coloque 'cambia_clave'.

Pruebalo.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar

Ayuda para armar un a href tomando un valor de un input text

Publicado por jose hernandez (4 intervenciones) el 09/06/2017 22:10:06
Saludos, muchas gracias por tomarte un tiempo para ayudarme, pero no me funcionó, anexo todo el código.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
<head>
 
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta charset="utf-8">
	<title> Otra Prueba</title>
 
	<script>
		link = document.querySelector('#cambia_clave');
	        link.addEventListener('click', function(e) {
	                  valor = document.querySelector('#txt_nick').value;
	                  this.href = this.href + valor;
	        });
	</script>
</head>
<body>
		valor: <input type="text" id ="txt_nick" maxlength="20" value="" >
		<a href="cambiaclav.php?usr=" id="cambia_clave"> Cambiar clave</a>
 
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de [abZeroX]
Val: 477
Bronce
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Ayuda para armar un a href tomando un valor de un input text

Publicado por [abZeroX] (130 intervenciones) el 10/06/2017 23:53:36
Hola el código de kip esta muy bien, el problema es tu colocaste el código en la sección del head y cuando javascript intenta seleccionar el elemento del DOM (#cambia_clave) no se sabe que es porque todavía este no se creo. Para solucionarlo puedes poner el script antes de la etiqueta de cierre del body o de otra forma utilizar el evento load en el objeto windows.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta charset="utf-8">
	<title>Otra Prueba</title>
</head>
<body>
	valor: <input type="text" id ="txt_nick" maxlength="20" value="" >
	<a href="cambiaclav.html?usr=" id="cambia_clave"> Cambiar clave</a>
	<script>
		window.onload = function() {
			link = document.querySelector('#cambia_clave');
			link.addEventListener('click', function(e) {
				valor = document.querySelector('#txt_nick').value;
				this.href = this.href + valor;
			});
		};
	</script>
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
2
Comentar
sin imagen de perfil

Ayuda para armar un a href tomando un valor de un input text

Publicado por Jose (4 intervenciones) el 12/06/2017 15:37:04
Muchisimas gracias por la aclaratoria, como lo mencione en mi primer post desconozco mucho de javascript, gracias por el tiempo e interes en colaborarme.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Ayuda para armar un a href tomando un valor de un input text

Publicado por Jose (4 intervenciones) el 12/06/2017 17:09:01
Muchisimas gracias por la aclaratoria, como lo mencione en mi primer post desconozco mucho de javascript, gracias por el tiempo e interes en colaborarme. Solucionado!!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar