Aufruf einer python-Methode zum abrufen von Daten aus einem javascript-Funktion auf der html-Seite

Technologien eingesetzt

• Google app engine
• Django
• Python
• Jquery

Details der code und code-Auszügen

Ich habe ein drop-down-Liste (Land) und eine text-box (Stadt) { die drop-down-Liste und text-Feld generiert werden durch einen django-form}, das get automatisch gefüllt, indem Sie eine GeoIp-Bibliothek

Bild, wie diese UI-Elemente Aussehen der html-Seite:

1. Code-Auszug, der füllt in der drop-down-Liste und der text-box:

   //Auswahl der Benutzer Land und Benutzer der Stadt,
   //die id für die Benutzer Land drop-down-Liste "id_country_name"
   //die id für die Benutzer, Stadt-text-box ist id_city_name
   $(function () {
   $("#id_country_name").val(geoip_country_name());
   $("#id_city_name").val(geoip_city());
   //an diesem Punkt der Benutzer das Land und die Stadt sind Werte aus dem javascript-Aufruf
   //jetzt ist die Zeit zu nennen, python-code, um die Daten-Werte berichtet, die von anderen Usern für user Land und Stadt

       });
   </script>

2. Beispiel python-code zur Abfrage der Datenbank

   def get_data_for_users_country_and_city(self):
       query = db.GqlQuery("SELECT * FROM UserReportedCity where county.country_name = country_name and city.city_name = city")
       data = query.fetch(10)

Muss ich wahrscheinlich Paket diese Elemente in eine Vorlage und dann wieder zurück auf die html-Seite

template_values = {
       self.__TEMPLATE_DATA_FOR_USER: data 
    }

    #rendering the html page and passing the template_values
    self.response.out.write(template.render(self.__MAIN_HTML_PAGE, template_values))

Bitte beachten Sie, dass ich noch nicht getestet, python-code noch.

Frage

Einmal die Werte für Land und Stadt sind gefüllt, die durch den javascript-Aufruf, möchte ich einen Aufruf einer python-Methode, um die Daten für Benutzer das Land und die Stadt, und füllen Sie es in "Ihrer Stadt" tab.

[EDIT#1]

Versucht, die Anregungen von @Fabio Diniz und @Kevin P

Den folgenden html-und javascript-code:

<!-- script snippet to fill in users country and city value by making a calls to the geoip library -->  
<script type="text/javascript">
    //selecting users country and users city, 
    //the id for users country drop-down list is "id_country_name"
    //the id for users city text-box is id_city_name
    $(function () {
        $("#id_country_name").val(geoip_country_name());
        $("#id_city_name").val(geoip_city()) 
     });

    $.post("/AjaxRequest/get_data_for_users_country_city", { 
        selected_country_name: document.getElementById('id_country_name').value, 
        selected_city_name: document.getElementById('id_city_name').value 
    },
    function(data) {
        alert("hello");
     }
    );

</script>

Folgende zeigt an, dass die Anfragen zu "/AjaxRequest/get_data_for_users_country_city" sollte gehen "AjaxRequest-Klasse".

def main():
  application = webapp.WSGIApplication([('/', MainPage),
                                      ('/UserReporting', UserReporting),
                                      ('/AjaxRequest/get_data_for_users_country_city', AjaxRequest )
                                      ],
                                     debug=False)

run_wsgi_app(application)

Code in "AjaxRequest-Klasse"

from google.appengine.ext import db

class AjaxRequest(webapp.RequestHandler):

  def post(self):
    user_reported_country_get = self.request.get('selected_country_name')
    user_reported_city_get = self.request.get('selected_city_name')
    data_for_users_country_city = self.get_data_for_users_country_and_city(user_reported_country_get, user_reported_city_get)
    self.response.out.write (data_for_users_country_city)

Problem:

Im debug-Modus kann ich sehen, dass der Aufruf von javascript-Methode macht es auf die "AjaxRequest", "post" - Methode. Das problem ist, dass die "user_reported_country_get" und "user_reported_city_get haben" keine string-Werte, die vom javascript-code.

[EDIT#2]

Basiert auf dem Vorschlag gegeben durch @Matt Ball, versuchte ich die folgende code-Auszug in der javascript-Aufruf

<!-- script snippet to fill in users country and city value by making a calls to the geoip library -->  
<script type="text/javascript">
    //selecting users country and users city, 
    //the id for users country drop-down list is "id_country_name"
    //the id for users city text-box is id_city_name
    $(function () {
        $("#id_country_name").val(geoip_country_name());
        $("#id_city_name").val(geoip_city()) 
     });

    $.post("/AjaxRequest/get_data_for_users_country_city", { 
        selected_country_name: $('#id_country_name').val(),
        selected_city_name: $('#id_city_name').val()            
    },
    function(data) {
        alert("hello");
     }
    );

</script>

HTML-code Auszug für "Land" drop-down-Liste und die Stadt-text-Feld. Hier die id für das Land drop-down-Liste "id_country_name" und die Stadt-text-box "id_city_name"

<div id="userDataForm">
 <form method="POST" action="/UserReporting"> 
   <table>
        <!-- Printing the forms for users country, city -->
        <tr><th><label for="id_country_name">Country name:</label></th><td><select       name="country_name" id="id_country_name">
<option value="" selected="selected">---------</option>
<option value="Afghanistan">Afghanistan</option>

</select></td></tr>
        <tr><th><label for="id_city_name">City name:</label></th><td><input type="text" name="city_name" id="id_city_name" /></td></tr>     
   </table>
 </form>

Im python-debugger die Werte für "select_country_name" und "selected_city_name" sind noch leer, wie dargestellt durch die folgende Abbildung

[EDIT#3]

Ich dachte, dass aus irgendeinem Grund, während der Aufruf von python geschieht, bevor das "id_country_name" und "id_city_name" Werte eingetragen sind. Also anstatt zu versuchen, geben Sie die Werte von "id_country_name" und "id_city_name", die ich direkt an die Werte der geoip_country_name() und geoip_city(). Diese erfolgreich bestanden, den Namen des Landes und des namens der Stadt zurück, um python-code.

Hier ist der code-Ausschnitt habe ich versucht.

<!-- script snippet to fill in users country and city value by making a calls to the geoip library -->  
<script type="text/javascript">
    //selecting users country and users city, 
    //the id for users country drop-down list is "id_country_name"
    //the id for users city text-box is id_city_name
    $(function () {
        $("#id_country_name").val(geoip_country_name());
        $("#id_city_name").val(geoip_city()) 
     });

    $.post("/AjaxRequest", { 
        selected_country_name: geoip_country_name(),
        selected_city_name: geoip_city()            
    },

    function(data) {
        alert($('#id_country_name').val());
        alert($('#id_city_name').val())
     }

    );

</script>

[EDIT#4]

Basierend auf dem feedback von @hyperslug, zog ich die “$.post("/AjaxRequest" “ Stück innerhalb der Funktion wird der Benutzer Land drop-down-Liste und Benutzer der Stadt-text-Feld.

Dieser code korrekt übergibt der Benutzer das Land und die Stadt, um python-code.

Javascript-code Auszug:

<!-- script snippet to fill in users country and city value by making a calls to the geoip library -->  
<script type="text/javascript">
    //selecting users country and users city, 
    //the id for users country drop-down list is "id_country_name"
    //the id for users city text-box is id_city_name
    $(function () {

        //finding the users country and city based on their IP.
        var $users_country = geoip_country_name()
        var $users_city = geoip_city()

        //setting the drop-down list of country and text-box of the city to users country and city resp
        $("#id_country_name").val($users_country);
        $("#id_city_name").val($users_city);

        //since we have users country and city, calling python class to get the data regarding users country and city combination 
        $.post("/AjaxRequest", { 
            selected_country_name: $users_country,
            selected_city_name: $users_city         
        })

     });

</script>