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

AJAX Discussion :

Requêtes AJAX / PYTHON


Sujet :

AJAX

  1. #1
    Nouveau membre du Club
    Requêtes AJAX / PYTHON
    Bonjour,

    je suis bloque sur la manière de faire mes requêtes Ajax.
    Ce que je souhaiterais faire c'est d'envoyer la valeur de mon textarea a mon fichier python et qu'une fois que mon fichier python a traite la valeur de textArea il l'envoie

    fichier api.py // fichier auquel j'aimerais envoyer la chaine de caractère de mon texteArea pour le remplacer par le input
    Code Python :Sélectionner tout -Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    import wikipedia
     
     
    liste_ville = ["paris", "marseille", "lyon", "toulouse", "nice", "nantes", "montpellier", "strasbourg", "bordeaux", "lille", "rennes", "reims", "toulon",
    				"grenoble", "dijon", "angers", "nimes", "villeurbanne", "limoges", "annecy", "perpignan", "metz", "argenteuil", "rouen", "mulhouse", 
    				"montreuil", "caen", "nancy", "tourcoing", "roubaix", "nanterre", "avignon", "dunkerque", "poitiers"]
     
    wiki = wikipedia.set_lang("fr")
     
    a = input()
     
    for i in range(len(a.split())):
    	for j in range(len(liste_ville)):
    		if a.split()[i] == liste_ville[j]:
    			print(wikipedia.summary(a.split()[i], sentences=2))



    fichier .js // fichier ou je recupere la valeur de mon textArea et je renvois une div sur ma page web mais au lieu de renvoyer la valeur que je recupere en input sur ma page web j'aimerais l'envoyer sur mon fichier python et qu'un fois traité par mon fichier python ça renvoit mon "print(wikipedia.summary(a.split()[i], sentences=2))" a la ligne 7 de mon fichier.js a la place de textArea

    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
    function send_msg(){
    	var textArea = $("#textArea").val()
        if (textArea == ''){
    	alert("Veuillez entrer du texte")
    	}
    	else {
    	$("#chatBot").append('<div class="message_container_send">'+textArea+'</div>')
    	$("#textArea").val('')
    	}
    }
    $("#valider").click(send_msg);
    $("#textArea").keypress(function(event){
        var keycode = (event.keyCode ? event.keyCode : event.which);
    	    if(keycode == '13'){
    	    	send_msg();
    	}
    });


    J'ai bien lu les tutos mais j'ai vraiment du mal avec Ajax alors que ça a pas l'air si compliqué que ça mais bon ... donc merci d'avance pour ceux qui m'aident a progresser

  2. #2
    Membre émérite
    Salut,

    je ne vois aucune appelle ajax dans ton code, difficile de t'aider......

  3. #3
    Nouveau membre du Club
    justement je ne vois pas du tout comment faire ...

    Si c'était pour gérer ça en Ajax directement avec et dans mon fichier javascript je sais comment faire, mais pour envoyer la valeur a mon fichier python et renvoyer la valeur de mon fichier python a mon fichier js je vois pas du tout comment faire ...

  4. #4
    Nouveau membre du Club
    j'ai pris ce chemin dis moi ce que vous en pensez ?

    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
    function send_msg(){
    	var textArea = $("#textArea").val()
    	var request = $.get("/sendRequest/" + $("#textArea").val());
        if (textArea == ''){
    	alert("Veuillez entrer du texte")
    	}
    	else {
    	$("#chatBot").append('<div class="message_container_send">'+request+'</div>')
    	$("#textArea").val('')
    	}
    }
    $("#valider").click(send_msg);
    $("#textArea").keypress(function(event){
        var keycode = (event.keyCode ? event.keyCode : event.which);
    	    if(keycode == '13'){
    	    	send_msg();
    	}
    });


    Code Python :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
    from flask import Flask, render_template, jsonify
    import requests
    import wikipedia
     
    app = Flask(__name__)
    search_google_maps = "https://maps.googleapis.com/maps/api/place/textsearch/json"
    api_key = "****"
     
    @app.route("/", methods=["GET"])
    def retrieve():
    	return render_template('grandPy.html')
     
    @app.route("/sendRequest/")     
     
    def wiki():
    	city_list = ["paris", "marseille", "lyon", "toulouse", "nice", "nantes", "montpellier", "strasbourg", "bordeaux", "lille", "rennes", "reims", "toulon",
    					"grenoble", "dijon", "angers", "nimes", "villeurbanne", "limoges", "annecy", "perpignan", "metz", "argenteuil", "rouen", "mulhouse", 
    					"montreuil", "caen", "nancy", "tourcoing", "roubaix", "nanterre", "avignon", "dunkerque", "poitiers"]
     
    	wiki = wikipedia.set_lang("fr")
     
    	for i in range(len(city.split())):
    		for j in range(len(city_list)):
    			if city.split()[i] == city_list[j]:
    				data_wiki = wikipedia.summary(city.split()[i], sentences=2)
    				return jsonify({'result'	:	data_wiki})
     
    if __name__ == "__main__": 
    	app.run(debug=True)

  5. #5
    Membre émérite
    Salut,

    Lorsque tu dis Python, tu parles d'un langage serveur, tout comme Php ou autre..., et le principe d'ajax c'est d'envoyer des données javascript vers un script serveur (python dans ton cas), puis ce dernier les récupère et renvoi une réponse (selon une logique bien précise... ).

    Je ne suis pas un fan de python mais je pense que le principe est le même, donc si on prend par exemple ta fonction send_msg qui contient un $.get, tu dois utiliser le callback (fonction de rappelle) :
    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
     
    function send_msg(){
    	var textArea = $("#textArea").val();
             if (textArea== ''){
    	     alert("Veuillez entrer du texte");
    	}
    	else {
                $.get("/sendRequest/",{ donneesJs : textArea  })
                .done(function(data){//callback de succès
                    $("#chatBot").append('<div class="message_container_send">'+data+'</div>');
    	         $("#textArea").val('');
                })
                .fail(function(erreur){//callback d'erreur
                     alert("Erreur get :"+erreur);
                 });
    	}
    }


    Et dans ton fichier serveur Python, tu dois récupérer la variable donneesJs, je ne sais pas comment ça se fait en python mais en php on met $text=$_GET["donneesJs"]; ou $text=$_POST["donneesJs"] tout dépend de la méthode utilisée soit get ou post.

    Voir la documentation de $.get.

  6. #6
    Nouveau membre du Club
    Ce message n'a pas pu être affiché car il comporte des erreurs.

  7. #7
    Membre émérite
    La ligne 26 du 2éme fichier ce qui correspond à
    Code :Sélectionner tout -Visualiser dans une fenêtre à part
    map = new google.maps.Map(document.getElementById('map'), {...}
    ?
    Puis pourquoi tu déclare la fonction initMap() DANS le callback done de $.post ?
    Ton code doit ressembler à ceci :
    Code :Sélectionner tout -Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     
    $.post('/data', {text: textArea,}).done(function(get_data) {
    			$("#chatBot").append('<div class="message_container">'+get_data["wiki_answer"]+'</div>');
    			$("#chatBot").append('<div class="message_container" id="map'+initMap+'</div>');
     
    			map = new google.maps.Map(document.getElementById('map'), {
    			  center: get_data["data_lat"], get_data["data_lng"],
    			  zoom: 8
    			});
     
    		});


    La variable center normalement est un tableau qui contient 2 variables get_data["data_lat"] et get_data["data_lng"] donc il faut les mettre dans un tableau comme suite :
    center: [get_data["data_lat"], get_data["data_lng"] ].

  8. #8
    Nouveau membre du Club
    tout d'abord merci encore pour ton aide

    c'est vrai que la fonction intimap n'était pas nécessaire mais je bêtement repris la manière dont s'était fait dans la doc ...

    Et l'erreur est a la ligne 27 (center: get_data["data_lat"], get_data["data_lng"]), j'avais pas vu le saut de ligne au début pardon .

###raw>template_hook.ano_emploi###