[SOLUCIONADO] tiempo real ajax con mysql

[fernandooj]

hola chicos saludos a todos, tengo una duda con el siguiente ejercicio cualquier guia sera de mucha ayuda

-tengo una lista de productos de una base de datos
-le doy clic en editar ese producto, me lleva al producto a editar con edt.php?id=
-me muestra el detalle del producto.
- hay un campo que dice cantidad del producto

ahora lo que necesito es en un segundo campo vacio poner un numero
y que en un tercer campo me de la suma de los dos primeros, pero en tiempo real
no me sirve ajax por que el ejercicio tiene que ser solo un documento y ajax maneja dos por eso estoy confundido,
por favor si alguno me puede decir por que camino andar me ayudaria mucho

gracias

[Alexis88]

Pues con una simple función elaborada en JavaScript, es suficiente, no es necesaria una petición asíncrona (Ajax).



Asigno un Id a cada caja y al botón que ejecutará la función que sumará los valores en cuestión. Esto es para poder tomarlos fácilmente, aunque hay otras formas. Luego, cuando pulse el botón (evento click), verifico que el valor ingresado en la segunda caja sea un número (diferente a NaN que significa "Not a number"), de ser un número, realizo la suma y la asigno a la tercera caja.

Saludos

[fernandooj]

Alexis gracias por la respuesta me ayudas con parte de la solucion por que tambien necesito que la respuesta me salga inmediatamente escribo el segundo el segundo numero sin necesidad de hacer click en un boton

seria eso no mas

gracias

[Alexis88]

Pues, solamente necesitas aplicar la misma lógica que presento, con la diferencia de que usarías al evento keyup en la segunda caja en lugar del evento click en el botón.

Código Javascript:

b.addEventListener("keyup", function(){
    if (!isNaN(this.value))
        c.value = Number(a.value) + Number(this.value);
}, false);
 

Saludos

[fernandooj]

si tienes razon ya lo hice, y esta bien, pero una ultima cosa cuando lo ejecuto con el navegador me sale: Uncaught ReferenceError: s is not defined y no lo ejecuta que crees que pueda ser

[Alexis88]

Bueno, si no muestras código, no podré ayudarte.

[fernandooj]

es tal y como me lo diste

Código Javascript:

var boton = document.getElementById("s"),
    a = document.getElementById("a"),
    b = document.getElementById("b"),
    c = document.getElementById("c");
 
s.addEventListener("click", function(){
    if (!isNaN(b.value))
        c.value = Number(a.value) + Number(b.value);
}, false);
 

en jsfiddle funciona bien
pero al probarlo en el navegador sale ese error y no lo ejecuta

[Alexis88]

Ah caray, es un error mío. En lugar de la s, debe estar la palabra boton, pero en este caso, el código debe quedar así:

Código JavaScript:

var a = document.getElementById("a"),
    b = document.getElementById("b"),
    c = document.getElementById("c");
 
b.addEventListener("keyup", function(){
    if (!isNaN(this.value))
        c.value = Number(a.value) + Number(this.value);
}, false);
 

Este es el código correcto.

[fernandooj]

Alexis que pena molestarte tanto pero ahora me aparece este error:
Uncaught TypeError: Cannot call method 'addEventListener' of null

[Alexis88]

Eso se debe a que probablemente no estés tomando al elemento correctamente. Por favor, muéstrame el código HTML y JavaScript que has elaborado para este problema. No olvides utilizar los respectivos hightlights.

[fernandooj]

lo copie y pegue tal y como esta en el jsfiddle

Código Javascript:

var a = document.getElementById("a"),
    b = document.getElementById("b"),
    c = document.getElementById("c");
 
b.addEventListener("keyup", function(){
    if (!isNaN(this.value))
        c.value = Number(a.value) + Number(this.value);
}, false);
 

Código HTML:

Cantidad 1: <input type = "text" id = "a" value = 5 readOnly />
Cantidad 2: <input type = "text" id = "b" autofocus />
Resultado: <input type = "text" id = "c" readOnly />
 

[Alexis88]

¿De casualidad estás colocando este código en la cabecera del documento? Si es así, el error se debe a que el código JavaScript carga antes que los elementos HTML, por eso no los toma y se produce el error. Coloca el código JavaScript justo antes de la etiqueta </body> y prueba. Me avisas cómo te fue.

[fernandooj]

Alexis felicitaciones si era eso muchas gracias te debo una