JavaScript - Convertir el valor de un input en una variable php

   
Vista:

Convertir el valor de un input en una variable php

Publicado por Unexes (30 intervenciones) el 25/08/2015 21:49:50
Hola a todos y gracias por vuestras ayudas anteriores, gracias a ello ya voy dominando un poco mejor javascript.

Vereis tengo un problema que no se resolver y me gustaria pediros a ver si me podeis ayudar.

Necesito una vez calculada una superficie convertir el valor del input "superficie" en una variable de php para poder realizar con dicha variable una consulta a mi base de datos y mostrar el Precio_Final dependiendo del valor de esa variable.

La parte del calculo de la superficie ya la tengo resulta pero no se como pasar el valor del id="superficie" a una variable de php sin recargar de nuevo la página.

Esto es lo que tengo que me calcula la superficie y hasta aquí bien
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<head>
<script>
function multiplicar(){
  m1 = document.getElementById("Ancho").value;
  m2 = document.getElementById("Alto").value;
  r = m1*m2;
  document.getElementById("superficie").value = r;
}
</script>
</head>
 
<body>
<form id="multiplicar">
  <input type="text" id="Ancho" value=0 onChange="multiplicar();"> X
  <input type="text" id="Alto" value=0 onChange="multiplicar();"> =
  <input type="text" id="superficie">
</form>
</body>

He probado con lo siguiente y con otras formas pero nada de nada, gracias a todos.
En el script sustitui
1
2
3
document.getElementById("superficie").value = r;
por:
var resul = document.getElementById("superficie").value=r;
y en el body añadi despues del form esto:
1
2
3
$varphp = "<script>document.write(resul)</script>";
echo $varphp ;
?>

Pero no he conseguido hacerlo funcionar. Un saludo a todos.
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
información
Otras secciones de LWP con contenido de JavaScript
- Código fuente de JavaScript
- Cursos de JavaScript
- Temas de JavaScript
- Chat de JavaScript
información
Códigos de JavaScript
- em Zoom
- Enlace aleatorio
- Cifrado César
Imágen de perfil de xve

Convertir el valor de un input en una variable php

Publicado por xve (1596 intervenciones) el 26/08/2015 09:00:07
Hola Unexes, si lo quieres hacer sin refrescar la página, la unica manera que se me ocurre, es utilizando AJAX...

Aquí te he preparado un siemple ejemplo:

http://www.lawebdelprogramador.com/codigo/JQuery/3262-Como-pasar-una-variable-de-JavaScript-a-PHP.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

Convertir el valor de un input en una variable php

Publicado por Unexes (30 intervenciones) el 26/08/2015 10:57:24
Gracias xve.

He probado tu ejemplo y perdona mi ignorancia porque en el ejemplo que me has puesto no veo la forma de adaptarlo a lo que yo necesito a pesar de que el mismo es sencillo y esta clarisimo lo que hace.

En tu ejemplo pasas el valor de la variable de javascript que se encuentra en "index.php" a otra página "archivo.php" y lo muestras con un alert, y yo lo que necesito es convertir la variable en la misma página o tener acceso a dicha variable en la misma página sin refrescar la misma para compararla con un determinado campo de mi base de datos.

Es muy posible que la solución a lo que necesito este en tu ejemplo de una forma clara y todos la vean, yo por desgracia no la veo por mi ignorancia y mis pocos conocimientos actuales de Ajax y javascript, ya que me estoy iniciando en estos lenguajes.

Si me pudierais seguir ayudando a poder adaptarlo os lo agradecería.

Un saludo y gracias a todos por vuestra ayuda.
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 xve

Convertir el valor de un input en una variable php

Publicado por xve (1596 intervenciones) el 26/08/2015 12:16:46
Hola Unexes, si te fijas, en el ejemplo que te he puesto, no se refresca la pagina... se envía el valor a php en el servidor y devuelve un texto de respuesta, que puede ser un texto, un numero o lo que quieres, el cual puedes comprar con otra variable o poner en la pagina...

Recuerda que las variables de php no se ejecutan en el navegador...
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

Convertir el valor de un input en una variable php

Publicado por Unexes (30 intervenciones) el 27/08/2015 10:42:12
Gracias xve de nuevo por ayudarme.

Lo siento no quiero abusar de tu amabilidad entiendo la explicación que me das pero por mas intentos que hago no sé cómo recuperar el valor del texto de respuesta en la misma página index.php y poderlo comparar en una consulta, supongo que será algo muy básico y muy sencillo pero no lo veo, voy a hacer pruebas y a ver si volviendo a mirar en la red consigo hacerlo funcionar.

Perdona las molestias con algo simple pero que no se como hacerlo.

Un saludo.
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 xve

Convertir el valor de un input en una variable php

Publicado por xve (1596 intervenciones) el 27/08/2015 22:15:35
Hola Unexes, intento explicarte...

entiendo que esta función si la entiendes, verdad?
1
2
3
4
// Enviamos la variable de javascript a archivo.php
$.post("archivo.php",{"texto":miVariableJS},function(respuesta){
	alert(respuesta);
});

para comparar el resultado con una variable de javascript, seria algo así:
1
2
3
4
// Enviamos la variable de javascript a archivo.php
var miVariable=1;
$.post("archivo.php",{"texto":miVariableJS},function(respuesta){
         if(='editor_code'>miVariable==respuesta
) { alert("Correcto"); } });
Es esto lo que quieres?
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
Imágen de perfil de Vainas

Convertir el valor de un input en una variable php

Publicado por Vainas (239 intervenciones) el 28/08/2015 09:50:53
Buenas:

Una pregunta. Son muchos valores los que tienes que consultar en la bbdd? Es decir la variable Precio_Final tiene muchas opciones?

Lo digo por que podrias traerlas al principio dentro de una etiqueta script como una variable y te evitas tener que consultar por ajax de nuevo al servidor.

Buscate un tutorial de ajax primero y entiende lo que hace. Cuando tengas el concepto entenderas como hay que llamar a un valor en el servidor sin recargar la pagina.

xve ya te ha dado algo de info. Yo te dejo este enlace: http://www.w3schools.com/ajax/default.asp

Saludos.
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

Convertir el valor de un input en una variable php

Publicado por Unexes (30 intervenciones) el 28/08/2015 10:34:53
Muchas gracias a los dos xve y Vainas.

xve ya empiezo a entender el funcionamiento y creo que con la ayuda que me has facilitado voy a intentarlo resolver, por supuesto si lo consigo sin tener que volver a realizaros otra consulta pondré aquí como lo he resuelto para que los demás puedan verlo, como siempre he hecho.

xve en realidad no quiero comparar
1
miVariable==respuesta

lo que quiero es utilizar el valor de "respuesta" en una consulta de php

Vainas gracias a ti también por tu interés, contestando a tu pregunta son muchos los valores, el "Precio_Final" tiene muchas opciones.
Sobre el tutorial de ajax estoy en ello y agradezco el enlace que has puesto aunque es una pena para mi que este en Ingles, pero no importa solo se trata de esforzarse un poco mas para aprender.

Gracias a los dos y ya os comento.

Un saludo
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 Vainas

Convertir el valor de un input en una variable php

Publicado por Vainas (239 intervenciones) el 28/08/2015 15:51:23
Tu pregunta sin miedo que para eso esta el foro.

Pues definitivamente necesitas ajax si son muchos valores entonces. La idea es la siguiente por si no entiendes en ingles:

Se trata que tu estas en una pagina (html, php, asp... lo que sea eso es lo de menos) y vas a enviar por javascript una consulta a otro php en el servidor, esta peticion puede ser GET o POST de momento pensemos que va a ser GET. Cuando tu envias la peticion va a ser igual como cuando recargas una pagina: llamas al servidor http://miurl.com/index.php?variable_a_enviar=mi_valor y este te va a desvolver en un principio html de vuelta (puede ser todo o una parte de un html, es decir solo un div por ejemplo o solo un form.... me explico?

Como haces esa llamada asi:

1
2
//Creas un objeto en javascript xmlHttpRequest:
var xmlhttp=new XMLHttpRequest();

Ese objeto va a llamar al servidor de la siguiente manera:
1
2
xmlhttp.open("GET","datos.php?variable_a_enviar=mi_valor",true);
xmlhttp.send();

Los valores de la funcion open se entienden. (Metodo, url, asincrono);
La llamada a send al final es para que se inicie la llamada (como cuando das enter despues de meter una url en el navegador. Hasta aqui todo mas o menos facil.

Pero lo que no sabes aun es que pasa cuando el servidor devuelva los datos donde quedan?
el objeto creado xmlhttp tiene una funcion que se llama onreadystatechange que se va a activar cuando venga de regreso los datos (los datos o algun error en el servidor).

Hay que cargar la funcion antes del xmlhttp.send por que sino tendremos problemas.

1
xmlhttp.onreadystatechange=function(){....}

Dentro de la funcion podemos poner cualquier cosa pero lo normal es comprobar si se ha recibido un mensaje OK del servidor y no otro (404 not found 301.... esos que salen cuando no se encuentra una web por ejemplo). Para eso puedes usar:

1
if (xmlhttp.readyState==4 && xmlhttp.status==200){...}

y como ultimo lo que tienes que saber es que la propiedad responseText del objeto xmlhttp (xmlhttp.responseText) tiene lo que regresa el servidor.

Aqui el ejemplo completo de lo comentado: http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_first

Que envia el servidor? pues algo como echo "<div> hola mundo </div>"; por poner un ejemplo. eso queda almacenado en xmlhttp.responseText ya lo puedes colocar donde quieras.

Indudablemente que lo que te pone xve es ajax pero usando jQuery que por lo que se ve es mucho mas facil. Si tienes dudas te lo puedo dejar explicado.

Has una prueba implementa un hola mundo como te he puesto para que veas como llegan los datos con la url que te he pasado en tu mismo pc.

Ya nos contaras.

Saludos.
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

Convertir el valor de un input en una variable php

Publicado por Unexes (30 intervenciones) el 29/08/2015 13:23:11
Gracias Vainas por las molestias que te tomas en ayudarme y paso a comentarte:

Entiendo con las explicaciones que me habéis dado xve y tú el concepto, de hecho lo veo claro en ambas explicaciones y he realizado varias pruebas y me devuelve el valor correcto, mi problema bien por ofuscamiento o por que en lugar de cerebro tengo serrín es que ese valor que me devuelve en tú caso Vainas "xmlhttp.responseText" pasarlo a una variable de php para utilizarla en mi consulta, o en el caso de xve lo que tendría que pasar es el contenido de "respuesta".
Algo así : "$mivariable=xmlhttp.responseText" o "$mivariable=respuesta".

El código que me has puesto de ejemplo Vainas lo veo algo mas complicado para mi que el puesto por xve ya que lo que devuelve es el contenido de un .txt y yo en principio lo que necesito es que me devuelva el valor obtenido en un input, pero eso no seria un problema, en el ejemplo de xve, me devuelve en un alert el contenido que busco, pero necesito lo comentado anteriormente convertir ese contenido en una variable php para poder hacer mi consulta. ¿Como paso el contenido que me muestra el alert a una variable php?

Siento la extensión de mi explicación y el ser repetitivo, pero estoy atascado y de nuevo muchísimas gracias a los dos por vuestra ayuda.

Este es mi código actual:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
 
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
 
	<script>
	function enviar()
	{
		// Esta es la variable que vamos a pasar
		var miVariableJS=$("#texto").val();
 
		// Enviamos la variable de javascript a archivo.php
		$.post("archivo.php",{"texto":miVariableJS},function(respuesta){
			alert(respuesta);
		});
	}
	</script>
 
<script>
function multiplicar(){
  m1 = document.getElementById("multiplicando").value;
  m2 = document.getElementById("multiplicador").value;
  r = m1*m2;
  document.getElementById("texto").value = r;
}
</script>
</head>
 
<body>
<form id="multiplicar">
  <input type="text" id="multiplicando" value=0 > X
  <input type="text" id="multiplicador" value=0 onChange="multiplicar();enviar()"> =
  <input type="text" id="texto">
</form>
<!-- ***********Por ejemplo, algo así como esto es lo que necesitaría
para luego poder hacer despues mi consulta en esta misma página sin recargar-->
<?php
$mivariable_para_consultar = respuesta;
?>
<!-- **********************************************-->
</body>

Saludos.
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 Vainas

Convertir el valor de un input en una variable php

Publicado por Vainas (239 intervenciones) el 29/08/2015 14:00:03
Buenas:

Basandome en tu codigo:

1
$.post(...

Los datos los envias por POST a un php que se llama archivo.php OK? y envias solo uno que se llama texto y que tiene el valor de miVariableJS

Si es POST en el servidor se reciben como tal:

archivo.php
1
2
3
4
5
6
7
<?php
$variablePHP = $_POST['texto'];
//$variablePHP tiene ahora el valor de miVariableJS
//simplemente se la voy a desvolver al ajax agregandole un "hola" por ejemplo;
 
echo $variablePHP." Hola";
?>

ahora llega el momento que ajax recibe este dato:

1
2
function(respuesta){
			alert(respuesta);

Aqui tienes lo que has enviado por el echo de php.

Datos a tener en cuenta:
1. El envio de valores del cliente al servidor se hace por GET o POST como he dicho antes.
2. Puedes enviar x valores y los recibiras en $_POST['tus_valores'] como lo has hecho siempre en un formulario.
3. La vuelta de los valores al cliente puede ser un tanto confusa y me explico.
puedes enviar texto plano, puedes enviar xml, html o json entre seguramente otros pero estos son los principales.

Digo esto por que lo normal es enviar datos asi:
1
2
3
4
<?xml version="1.0" encoding="UTF-8"?>
<respuesta>
     <mi_variable>Aqui va el valor </mi_variable>
</respuesta>

Esto es xml. luego te sera facil manejarlo en jQuery:

1
2
3
4
function(respuesta){
datoEnJS = $(data).find("mi_variable").text();
//...
}

Ahora tenemos el valor en datoEnJS lo que nos queda es cuando dices:

convertir ese contenido en una variable php para poder hacer mi consulta. ¿Como paso el contenido que me muestra el alert a una variable php?

Para enviar un formulario en php solo creas el form en html y le metes inputs que enviaras al servidor. Pues en JS lo que tienes que hacer es crear un input hidden con el valor y meterlo dentro de tu formulario actual:

1
2
$form = $("Aqui tu id del form");
$form.append('<input type=hidden value="'+datoEnJS+'"');

Yo creo que esto es lo que quieres no?

Saludos.

Tu pregunta sin miedo que de momento no he mordido a nadie por preguntar.
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

Convertir el valor de un input en una variable php

Publicado por Osnola (1 intervención) el 22/04/2016 01:59:12
yo entiendo que lo único que quiere es mostrar un valor en un input, en tu navegador presiona F12 y intenta con esto en la consola

1
2
var input = document.getElementsByTagId("texto");
			input[0].value = "texto enviado";


de esa manera puedes enviar un texto a un input. El problema al que yo también me enfrento es que al enviar una variable (r en tu caso), lo que me muestra el input es [Object Text].

se que no es la solución completa pero espero haberte ayudado un poco
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