IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

Ajax return undefined data


Sujet :

jQuery

  1. #1
    Candidat au Club
    Femme Profil pro
    Étudiant
    Inscrit en
    Juin 2018
    Messages
    2
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Localisation : France, Hauts de Seine (Île de France)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Matériel informatique

    Informations forums :
    Inscription : Juin 2018
    Messages : 2
    Par défaut Ajax return undefined data
    Bonjour,

    j’utilise jquery ajax pour appeler un web service de type get codé en java.

    L'appel est bien passé (satuts= 200, textStatus= 4), mais il me met undefined comme réponse de la fonction success.

    Pouvez vous m'aider svp et me dire où est l'erreur?

    Merci.

    Mon web serveur:
    Code java : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    @GET
        @Path("/term/{term}")
        @Produces({MediaType.APPLICATION_JSON})
        public Response termQuery(@PathParam("term") String term ) {//, @PathParam("index") String index, @PathParam("type") String type) {    
            try {
     
                log.debug("searsh");
                //log.debug("index = " + index);
               // log.debug("type = " + type);
                log.debug("term = " + term);
             List<String> results = multiTypeSearchService.getTermQueryData(term);
                if (null == results) {
                    return Response.status(Status.BAD_REQUEST).entity("arg obligatoire").build();
                    }
             //String  suggestions = String.join(",", results);
                String json = new Gson().toJson(results);
                return Response.ok(json).build();
            } catch(Exception e) {
                   return tmExceptionMapper.toResponse(new TmException(Code.TECHNICAL_ERROR, e.getMessage()));
               }
        }

    jquery code:
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    <!DOCTYPE html>
    <html lang="fr">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>
    <body>
        <h1>Recupération de données ...!</h1>
        <textarea id ="input_search" class="form-control custom-control" rows="10"></textarea> 
        <textarea id = "output" class="Output" rows="10"></textarea>
        <button type="button" onclick="readfile()">Search</button>
    <script>
             
          var showoutput = $('#output');   
          var Url_newtm = 'http://localhost:8080/newtm/term/';
          function readfile(){
            var text_search = $('#input_search').val();
            $.ajax({
                //headers: {'Access-Control-Allow-Methods': 'GET'},
                contentType: "application/json; charset=UTF-8",
                type:'GET',
                data: {},
                url:Url_newtm+text_search,
                dataType: "script",
                async: false,
                 
                success: function(data, jqXHR, textStatus){
                    //alert(data);
                    //$('#output').html(result);
                    console.log(data);
                  },
                  error: function(jqXHR, textStatus, errorThrown){
                    console.log("error");
                    console.log(errorThrown)
                    console.log(textStatus)
                    console.log(jqXHR);
                  },
              });
          }
    </script>
    </body>
    </html>

    Nom : 1.PNG
Affichages : 7600
Taille : 49,3 Ko

  2. #2
    Membre chevronné
    Homme Profil pro
    Administrateur de base de données
    Inscrit en
    Avril 2018
    Messages
    537
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Administrateur de base de données

    Informations forums :
    Inscription : Avril 2018
    Messages : 537
    Par défaut
    Bonsoir

    dataType: "script",
    L'erreur vient du fait qu'il ne sait pas lire ce qu'il recoit avec ce dataType

  3. #3
    Candidat au Club
    Femme Profil pro
    Étudiant
    Inscrit en
    Juin 2018
    Messages
    2
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Localisation : France, Hauts de Seine (Île de France)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Matériel informatique

    Informations forums :
    Inscription : Juin 2018
    Messages : 2
    Par défaut
    Bonsoir,

    Merci pour la réponse.

    j'ai déjà essayé avec dataType: 'json' et ça ne marche pas. il me renvoie une erreur ci dessous et error pour textStatus.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    Object { readyState: 0, getResponseHeader: .ajax/E.getResponseHeader(), getAllResponseHeaders: .ajax/E.getAllResponseHeaders(), setRequestHeader: .ajax/E.setRequestHeader(), overrideMimeType: .ajax/E.overrideMimeType(), statusCode: .ajax/E.statusCode(), abort: .ajax/E.abort(), state: .Deferred/i.state(), always: .Deferred/i.always(), catch: .Deferred/i.catch(), 9 de plus… }
    ataType: 'script' je l'ai utilisé pour qu'il ne fasse pas une demande cross domain.

    je n'arrive toujours pas à comprendre c'est quoi le problème

  4. #4
    Expert confirmé
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 094
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 36
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 094
    Par défaut
    Bonjour,
    alors pour commencer :
    Non.

    Le premier « A » de ajax signifie « asynchrone ». Quand on force le mode synchrone, ça devient « sjax », et personne n’utilise ce terme pour deux bonnes raisons :

    1. c’est imprononçable ;
    2. c’est une mauvaise pratique.

    En plus, tu as l’air de déjà maîtriser le principe des callbacks, donc tu n’as aucune bonne raison de faire du synchrone.

    Ensuite, je vois que tu utilises jQuery 3. Je te conseil de mettre à jour ton code en suivant les recommandations de la doc :
    Deprecation Notice: The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are removed as of jQuery 3.0. You can use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    'use strict';
     
    let showoutput = $('#output');
    let Url_newtm = 'http://localhost:8080/newtm/term/';
     
    function readfile () {
      let text_search = $('#input_search').val();
      $.ajax({
        //headers     : { 'Access-Control-Allow-Methods': 'GET' },
        contentType : 'application/json; charset=UTF-8',
        method      : 'GET',
        data        : {},
        url         : Url_newtm + text_search,
        async       : true, // !!!
        //dataType    : ...,                        // (1)
      })
        .done(function (data, textStatus, jqXHR) {
          console.log(data);
          //$('#output').html(...);                 // (2)
        })
        .fail(function (jqXHR, textStatus, errorThrown) {
          console.log("error");
          console.log(errorThrown)
          console.log(textStatus)
          console.log(jqXHR);
        });
    }
    Deux remarques dans ce code :
    (1) le dataType n’est probablement pas nécessaire. Sans bien connaître le Java serveur, je devine que cette ligne :
    Code java : Sélectionner tout - Visualiser dans une fenêtre à part
    @Produces({MediaType.APPLICATION_JSON})
    fait en sorte que le serveur envoie un en-tête Content-Type: application/json. Cet en-tête sera détecté par jQuery. Si tu ajoutes dataType, l’en-tête est ignoré. Il vaut mieux faire confiance aux informations envoyées par le serveur.

    (2) si le json est interprété correctement, le paramètre data est de type JavaScript object. Lorsque tu le passes à .html, il est converti en chaîne via .toString() et devient la représentation complètement inutile '[object Object]'. Un peu de traitement est nécessaire ici, et ne connaissant pas la structure de ton json, je ne peux pas t’aider.
    Si tu veux simplement afficher le json, tu peux utiliser JSON.stringify(data), ou bien écraser le Content-Type en mettant l’option dataType: 'text'.
    La FAQ JavaScript – Les cours JavaScript
    Touche F12 = la console → l’outil indispensable pour développer en JavaScript !

Discussions similaires

  1. [AJAX] return fonction onreadystatechange
    Par Air P-E dans le forum AJAX
    Réponses: 8
    Dernier message: 05/10/2010, 17h04
  2. Réponses: 3
    Dernier message: 08/08/2010, 23h12
  3. [AJAX] Retour "undefined" d'une variable
    Par senacle dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 11/02/2009, 15h56
  4. [AJAX] return response.TXT AJax
    Par cyrilskof dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 04/09/2008, 09h49
  5. [DisplayTag] [JFreeChart] Unable to reset response before returning exported data
    Par seb_fou dans le forum Taglibs
    Réponses: 2
    Dernier message: 13/09/2004, 09h53

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo