elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Introducción a Git (Primera Parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  !Ayuda, ajax no funciona,en express.js
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] 2 Ir Abajo Respuesta Imprimir
Autor Tema: !Ayuda, ajax no funciona,en express.js  (Leído 7,278 veces)
bengy


Desconectado Desconectado

Mensajes: 501


mis virtudes y defectos son inseparables


Ver Perfil WWW
!Ayuda, ajax no funciona,en express.js
« en: 29 Agosto 2016, 00:06 am »

Código
  1.  
  2. <!DOCTYPE html>
  3. <title>login</title>
  4. <script src="jquery-3.1.0.js" type="text/javascript"></script>
  5. </head>
  6.  
  7.    <form class="formulario">
  8.     <p><input type="text "id="clickme"  value="n o m b r e"></p>
  9.     <p><input type="text "id="pass"  value=" c o n t r a s e n a"></p>
  10.     <input type="submit" id="botonEnviar" value="enviar">
  11.        </form>
  12.  
  13.  
  14.  
  15.  
  16.  
  17.    var id="idUsuario";
  18.    $('.formulario').submit(function(event) {
  19.        form_submit();    
  20.        return false;
  21.    });
  22.  
  23. function form_submit() {
  24.    var request = $.ajax({
  25.        url: 'login.php',
  26.        type: 'POST',
  27.        data: {
  28.            keystrokes : id
  29.        },
  30.        dataType: 'json',
  31.        contentType:'application/json',
  32.    });
  33.  
  34.    request.done(function(response) {
  35.        alert((response.status ? "Success: " : "Error: ") + response.message);
  36.        if(response.status) {
  37.            window.location.href = 'login.php';
  38.        }
  39.        else {
  40.            window.location.href = '';
  41.        }
  42.    });
  43.  
  44.    request.fail(function(jqXHR, textStatus) {
  45.        alert("Server request failed: " + textStatus);
  46.        window.location.href = '';
  47.    });
  48.  
  49.    request.error(function(result, sts,err) {
  50.        alert(err+":"+sts);
  51.  
  52.    });
  53. }
  54.    </script>
  55. </body>
  56. </html>
  57.  


Código
  1. <?php
  2.  
  3. $resultado = $_POST['keystrokes'];
  4. echo $resultado;
  5.  
  6. ?>


el error que me sale es parseerror, como lo soluciono ?


« Última modificación: 31 Agosto 2016, 01:19 am por .rn3w. » En línea

bengy


Desconectado Desconectado

Mensajes: 501


mis virtudes y defectos son inseparables


Ver Perfil WWW
Re: ajax no funciona, ayuda porfavor
« Respuesta #1 en: 29 Agosto 2016, 01:21 am »

el error que sale es "server request failed parseerror", ayuda no soy muy bueno con desarrollo web

saludos...


En línea

#!drvy
Moderador
***
Desconectado Desconectado

Mensajes: 5.855



Ver Perfil WWW
Re: ajax no funciona, ayuda porfavor
« Respuesta #2 en: 29 Agosto 2016, 08:57 am »

Cuando declaras dataType y contentType en el AJAX de jQuery, te debes asegurar tanto de enviar los datos en el formato correcto, como de recibirlos de dicha forma.

En este caso, declaras que lo que estas enviando es JSON y lo que esperas recibir es también JSON. PHP sin embargo responde de forma pura y ademas te tira un error porque ese parámetro no es reconocible para PHP (envías una cadena JSON la cual PHP no puede tratar). PHP no conoce esa forma de recibir datos. Lo mejor que puedes hacer es quitar el contentType:'application/json', de tu código para que detecte automáticamente el formato por el que mandarlo.

Si lo quitas, PHP reconocerá como POST las variables que mandes y podrás usar el array iterator para obtener el valor de keystrokes.

Para devolverlo, lo mismo, debes hablar el mismo idioma por el que te fue pedido.. lo debes devolver en JSON. La mejor forma seria:


Código
  1. header('Content-Type: application/json');
  2. $resultado = ( is_array($resultado) ? $resultado : array($resultado) );
  3. die(json_encode($resultado, true));

En la primera linea, le dices al navegador que lo que le vas a dar es contenido JSON.
En la segunda, te aseguras que $resultado es tratado como array para que json_encode funcione.
Y en la tercera, haces que el script "muera" devolviendo la variable $resultado como JSON.

Resumen:

- Quitamos la linea contentType del javascript.
- Cambiamos la forma en la que PHP devuelve el resultado para que jQuery lo trate bien y no le haga bullying.

Otras cosas a considerar:

- No uses .request.error() o al menos, no de esa forma. Es muy bruto. Usa solo .fail o asegúrate de que solo tire el alert() si realmente hay un error. La forma en la que esta puesto, tirara un alert() aunque no haya error.

- Para hacer debug correctamente quita las re direcciones y usa console.log()

- Deberías hacer que jQuery se cargue al final del body, igual que el resto de tu script.

Saludos
En línea

bengy


Desconectado Desconectado

Mensajes: 501


mis virtudes y defectos son inseparables


Ver Perfil WWW
Re: ajax no funciona, ayuda porfavor
« Respuesta #3 en: 29 Agosto 2016, 16:18 pm »

muchas gracias por responder, me ayudo mucho, pero aun sigue saliendo error "undefined" borre el contentType del javascript.

modifique el .php

Código
  1. <?php
  2. header('Cache-Control: no-cache, must-revalidate');
  3. header('Content-type: application/json');
  4. $resultado = $_POST['keystrokes'];
  5.  
  6. $resultado = ( is_array($resultado) ? $resultado : array($resultado) );
  7.  
  8. die(json_encode($resultado, true));
  9.  
  10. ?>


muchas gracias, espero que puedan ayudarme
« Última modificación: 29 Agosto 2016, 16:25 pm por .rn3w. » En línea

bengy


Desconectado Desconectado

Mensajes: 501


mis virtudes y defectos son inseparables


Ver Perfil WWW
Re: ajax no funciona, ayuda porfavor
« Respuesta #4 en: 29 Agosto 2016, 22:12 pm »

ayuda, yo se que esto es simple para ustedes, pero a mi me esta costando mucho, no se que pasa, como solucionarlo

!!!Ayuda
En línea

WHK
Moderador Global
***
Desconectado Desconectado

Mensajes: 6.605


Sin conocimiento no hay espíritu


Ver Perfil WWW
Re: ajax no funciona, ayuda porfavor
« Respuesta #5 en: 30 Agosto 2016, 03:16 am »

Hola amigo, te daré unos tips:

Cuando te aparezca un error fijate en que línea te aparece, por lo general los errores dicen el nombre del archivo mas el número de la línea, con eso te podrás dar mas cuenta del problema que debieras tener.

Código:
if(response.status) {

Fijate que en una parte del código dice "response.status", realmente existe "status"?. PHP retorna un valor no? pues ese valor es un array o un objeto, en tu caso cuando envías la petición post desde tu javascript estás enviando el valor "keystrokes : id" y estás escribiendo el mismo resultado desde php, por lo tanto no tienes la variable "status" declarada en ningún lado, por eso dice undefined porque status no está definido.

"response" equivale a lo que php entregó, en este caso no es un objeto

Código:
$resultado = ( is_array($resultado) ? $resultado : array($resultado) );
 die(json_encode($resultado, true));

Lo único que haces en es alínea es entregar el resultado como array. Digamos que $resultado equivale a "hola", entonces el resultado que entrega php queda así:

Código:
["hola"]

Para solucionar esto, desde php debes crear la variable llamada status y otro donde lleve el valor que desees entregar, por ejemplo:

Código:
die(json_encode(array('status' => 1, 'resultado' => $resultado)), true);

Entonces tendrás un resultado así:

Código:
{ "status": 1, "resultado": "hola" }

Ahora desde javascript debes procesar "status" y también "resultado".

Prueba con esto:

Código
  1. <?php
  2. if(isset($_POST) && isset($_POST['keystrokes'])){
  3.  
  4.    // Headers
  5.    header('Content-Type: application/json');
  6.  
  7.    $resultado = (string)$_POST['keystrokes'];
  8.    echo json_encode(array(
  9.        'status' => 1,
  10.        'result' => $resultado
  11.    ), true);
  12.    exit;
  13. }
  14. ?><!DOCTYPE html>
  15. <html>
  16.    <head>
  17.        <title>login</title>
  18.        <script src="jquery-3.1.0.js" type="text/javascript"></script>
  19.        <script type="text/javascript">
  20.  
  21.            var id = 'idUsuario';
  22.  
  23.            // Bind the form
  24.            $('.formulario').submit(function(event) {
  25.  
  26.                // Prevent sent the form
  27.                event.preventDefault();
  28.  
  29.                var request = $.ajax({
  30.                    url  : 'login.php',
  31.                    type : 'POST',
  32.                    data : {
  33.                        keystrokes : id
  34.                    },
  35.                    dataType    : 'json',
  36.                    contentType :'application/json',
  37.                });
  38.  
  39.                request.done(function(response) {
  40.  
  41.                    if(response.status) {
  42.                        alert('Success: ' + response.message);
  43.                        window.location.href = 'login.php';
  44.                    }
  45.                    else {
  46.                        alert('Error: ' + response.message);
  47.                        window.location.href = window.location.href;
  48.                    }
  49.                });
  50.  
  51.                request.fail(function(jqXHR, textStatus) {
  52.                    alert("Server request failed: " + textStatus);
  53.                    window.location.href = '';
  54.                });
  55.  
  56.                request.error(function(result, sts,err) {
  57.                    alert(err+":"+sts);
  58.  
  59.                });
  60.            });
  61.        </script>
  62.    </head>
  63.    <body>
  64.        <form class="formulario">
  65.            <p><input type="text "id="clickme"  value="n o m b r e"></p>
  66.            <p><input type="text "id="pass"  value=" c o n t r a s e n a"></p>
  67.            <input type="submit" id="botonEnviar" value="enviar">
  68.        </form>
  69.    </body>
  70. </html>

Saludos.
« Última modificación: 30 Agosto 2016, 03:24 am por WHK » En línea

flacc


Desconectado Desconectado

Mensajes: 854


Ver Perfil WWW
Re: ajax no funciona, ayuda porfavor
« Respuesta #6 en: 30 Agosto 2016, 04:47 am »

Yo seguiría las recomendaciones de los compañeros de mas arriba, ellos saben de lo que hablan, de todas formas cuéntanos como te va con el tema, y recuerda, te podemos guiar, pero tu debes alcanzar la meta.

Para entrar en detalles mas profundos con javascript, undefined es un estado (por decirlo de alguna forma) que puede aparecer por 2 razones:
  • La variable fue declarada (con var o con let) pero no inicializada.
  • Se intenta acceder a una variable que no a sido declarada.

Cuando undefined aparece porque la variable no fue inicializada el error debiera ser de referencia (ReferenceError, que es capturable con try catch), por otra parte, cuando se intenta acceder a una variable no definida (valga la redundancia), javascript nos notifica que la variable no existe con undefined (indefinida).

Ahora bien, cuando evaluamos expresiones con undefined se comporta de la siguiente manera:
  • Para cosas con números dirá que no es un número (NaN)
  • En expresiones booleanas será un false.

De acuerdo a lo que comento, podemos realizar las siguientes operaciones con variables y undefined:
Código
  1. // definida pero no inicializada
  2. var variable;
  3.  
  4. if (variable) // la variable es undefined, la evaluamos como booleana y se comporta como false
  5.  // codigo que nunca se ejecuta
  6.  
  7. if (otraVariable) // variable no definida, por lo tanto tambien es undefined y se comportara como false
  8.  // codigo que nunca se ejecuta
  9.  
  10. if (variable === undefined) // variable no definida es igual a undefined usando la coomparacion por tipos
  11.   // codigo que nunca se ejecuta
  12.  
  13. if (variable ==  undefined) // funciona tambien para comparaciones simples
  14.  // codigo qeu nunca se ejecuta
  15.  
  16. // tambien se puede obtener el tipo de undefined como string y compararlo
  17. if (typeof variable == 'undefined') // typeof devuelve el tipo de variable (undefined) como string
  18.  // codigo que nunca se ejecuta
  19.  


Bien, creo que lo he explicado relativamente entendible, ahora bien, el tema de undefined también se aplica a los arreglos con sub incides no definidos, y una cosa muy importante a la hora de jugar con esto, es que undefined es asignable (entre comillas).

Código
  1. var arreglo = [1];
  2.  
  3. console.log( arreglo[1] ); // el sub indice 0 existe, pero el sub indice 1 no, por lo tanto mostrara undefined
  4.  
  5. var algo = arreglo[1]; // esta es una curiosidad que no puedo explicar
  6. /*
  7.  * No lo he investigado, pueden ser 2 cosas, primero que como es undefined, la variable algo no se va a inicializar con undefined,
  8.  * ciertamente el compilador obtimiza varias cosas en el background, pero no se si asignará undefined a una variable que ya es undefined.
  9.  * Sería bueno que sepa que pasa ahí lo explicara.
  10.  */
  11.  

Espero te sirva la explicación de undefined.

Saludos
En línea

bengy


Desconectado Desconectado

Mensajes: 501


mis virtudes y defectos son inseparables


Ver Perfil WWW
Re: ajax no funciona, ayuda porfavor
« Respuesta #7 en: 30 Agosto 2016, 06:44 am »


hice algunos cambios
Citar
- Deberías hacer que jQuery se cargue al final del body, igual que el resto de tu script.
en el js

Código:
$(window).on('load', function() {	

y en ves de type lo puse method

Código:
method : 'POST',

y funciono gracias amigos, en realidad muchas gracias
« Última modificación: 30 Agosto 2016, 15:01 pm por .rn3w. » En línea

bengy


Desconectado Desconectado

Mensajes: 501


mis virtudes y defectos son inseparables


Ver Perfil WWW
Re: ajax no funciona, ayuda porfavor
« Respuesta #8 en: 30 Agosto 2016, 23:52 pm »

ahora estoy intentado implementar ajax en express.js
este es el layout.jade
Código
  1. doctype html
  2. html
  3.  head
  4.    title= title
  5.    link(rel='stylesheet', href='/stylesheets/style.css')
  6.    script(src="/javascripts/jquery-1.9.1.js")
  7.    script(type="text/javascript", src='/javascripts/forMain-Script.js')
  8.  body
  9.    block content
  10.  


mi formulario
Código
  1. extends layout
  2.  
  3. block content
  4.    h1= title
  5.    form(id="formulario")
  6.        div.input
  7.            span.label Description
  8.            textarea(name="description", cols="100", rows="3")
  9.        div.actions
  10.            input(id="botonEnviar",type="submit", value="enviar")


este es mi js
Código
  1. $(window).on('load', function() {
  2.  
  3. var id = 'idUsuario';
  4.  
  5.            $('#botonEnviar').click(function(event) {
  6.  
  7.                event.preventDefault();
  8.  
  9.                var request = $.ajax({
  10. method : 'POST',
  11.                    url    : 'http://localhost:3000/servidor',                    
  12.                    data   : {
  13.                        keystrokes : id
  14.                    },
  15.                    dataType    : 'json'
  16.                });
  17.  
  18.                request.done(function(response) {
  19.                    if(response.status) {
  20.                        alert('Success: ' + response.result + "\n Message: " + response.message);
  21.                        window.location.href = 'http://localhost:3000/servidor';
  22.                    }
  23.                    else {
  24.                        alert('Error: ' + response.message);
  25.                        window.location.href = window.location.href;
  26.                    }
  27.                });
  28.  
  29.                request.fail(function(jqXHR, textStatus) {
  30.                    alert("Server request failed: " + textStatus);
  31.                    window.location.href = '';
  32.                });
  33.            });
  34.  
  35. });


y en mi app.js puse este codigo que encontre en https://gist.github.com/diorahman/1520485

Código
  1. app.post('/servidor', function(req, res){
  2.  var obj = {};
  3.  console.log('body: ' + JSON.stringify(req.body));
  4.  res.send(req.body);
  5. });
  6.  
  7.  
  8. app.listen(3000);


me sale error 404 por consola, y por alert sale error

en el app.js siento que es el error, ayuda!!!
En línea

bengy


Desconectado Desconectado

Mensajes: 501


mis virtudes y defectos son inseparables


Ver Perfil WWW
Re: !Ayuda, ajax no funciona,en express.js
« Respuesta #9 en: 31 Agosto 2016, 03:47 am »

el app.js modifique de la siguiente manera

Código:
app.get('/', function (req, res){

   res.render('ajax.ejs');

});

app.post('/servidor', express.bodyParser(), function (req, res){

   console.log(req);
   console.log('req received');
   res.redirect('/');

});

pero aun no funciona,
En línea

Páginas: [1] 2 Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
div ( tabless ) no funciona a el mozilla con ajax Java.
.NET (C#, VB.NET, ASP)
surfrio 2 3,014 Último mensaje 31 Marzo 2008, 20:18 pm
por surfrio
jquery ajax error handler, no funciona
Desarrollo Web
bomba1990 2 4,208 Último mensaje 15 Agosto 2011, 06:45 am
por bomba1990
funciona Ajax en dispositivos moviles?
Dispositivos Móviles (PDA's, Smartphones, Tablets)
Hadess_inf 4 5,241 Último mensaje 22 Enero 2013, 20:38 pm
por #!drvy
No funciona puerto PCI Express
Hardware
Ganejash 2 9,543 Último mensaje 25 Mayo 2013, 15:00 pm
por Aprendiz-Oscuro
no me funciona el controlador en express
Desarrollo Web
Beginner Web 3 2,981 Último mensaje 16 Junio 2020, 06:22 am
por [u]nsigned
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines