调用python方法从html页面上的javascript函数获取数据 正在使用的技术 谷歌应用引擎 德扬戈 蟒蛇 Jquery 代码的详细信息和代码摘录

我有一个下拉列表（国家）和一个文本框（城市）{下拉列表和文本框由django表单生成}，由GeoIp库自动填充

这些UI元素在html页面上的外观图像：

填充下拉列表和文本框的代码摘录：

//选择用户所在国家/地区和用户所在城市， //用户id国家/地区下拉列表为“id\u国家/地区名称” //“用户id城市”文本框是“id\u城市\u名称” $（函数（）{ $（“#id#u country_name”）.val（geoip#u country_name（））； $（“#id#u city_name”）.val（geoip_city（））； //此时，用户的国家和城市值已从javascript调用中输入 //现在是调用python代码来获取其他用户为国家和城市用户报告的数据值的时候了

    });
</script>

我可能需要将这些项目打包到一个模板中，然后返回html页面

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))

请注意，我还没有测试这个python代码

问题: javascript调用填写完country和city的值后，我想调用python方法来获取用户country和city的数据，并将其填充到“Your city”选项卡中

[编辑#1]

尝试了@Fabio Diniz和@Kevin p给出的建议

以下是html和javascript代码：

<!-- 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>

“AjaxRequest”类中的代码

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)

问题：

在调试模式下，我可以看到javascript方法调用“AjaxRequest”、“post”方法。问题是“user\u reported\u country\u get”和“user\u reported\u city\u get”没有javascript代码给出的字符串值

[编辑#2]

根据@mattball给出的建议，我在javascript调用中尝试了以下代码摘录

<!-- 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>

//选择用户所在国家/地区和用户所在城市，
//用户id国家/地区下拉列表为“id\u国家/地区名称”
//“用户id城市”文本框是“id\u城市\u名称”
$（函数（）{
$（“#id#u country_name”）.val（geoip#u country_name（））；
$（“#id#u city_name”）.val（geoip_city（））
});
$.post（“/AjaxRequest/get_data_for_users_country_city”，{
所选的国家名称：$（'#id_country_name'）.val（），
所选城市名称：$（'#id_城市名称'）。val（）
},
功能（数据）{
警惕（“你好”）；
}
);

国家/地区下拉列表和城市文本框的HTML代码摘录。此处国家/地区下拉列表的id为“id\u country\u name”，城市文本框为“id\u city\u name”

国家名称：
---------
阿富汗
城市名称：

在python调试器中，“select_country_name”和“selected_city_name”的值仍然为空，如下图所示

[编辑#3]

我认为由于某种原因，在调用python时，在填写“id\u country\u name”和“id\u city\u name”值之前就发生了。因此，我没有尝试给出“id\u country\u name”和“id\u city\u name”的值，而是直接传递了geoip\u country\u name（）和geoip\u city（）的值。这成功地将国家名称和城市名称传递回python代码

这是我试过的代码摘录

<!-- 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>

//选择用户所在国家/地区和用户所在城市，
//用户id国家/地区下拉列表为“id\u国家/地区名称”
//“用户id城市”文本框是“id\u城市\u名称”
$（函数（）{
$（“#id#u country_name”）.val（geoip#u country_name（））；
$（“#id#u city_name”）.val（geoip_city（））
});
$.post（“/AjaxRequest”，{
所选国家/地区名称：geoip\u country\u name（），
所选城市名称：geoip\u city（）
},
功能（数据）{
警报（$（'id#u country_name'）.val（））；
警报（$（'#id_city_name'）.val（））
}
);

[编辑#4]

根据@hyperslug给出的反馈，我将“$.post（“/AjaxRequest”）块移动到函数中，该函数设置用户国家/地区下拉列表和用户城市文本框

此代码正确地将用户的国家和城市传递给python代码

Javascript代码摘录：

<!-- 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>

//选择用户所在国家/地区和用户所在城市，
//用户id国家/地区下拉列表为“id\u国家/地区名称”
//“用户id城市”文本框是“id\u城市\u名称”
$（函数（）{
//根据用户的IP查找用户所在国家和城市。
var$users\u country=geoip\u country\u name（）
var$users\u city=geoip\u city（）
//将国家/地区下拉列表和城市文本框设置为用户国家/地区和城市
$（“#id_country_name”）.val（$users_country）；
$（“#id_city_name”）.val（$users_city）；
//因为我们有用户country和city，所以调用python类来获取关于用户country和city组合的数据
$.post（“/AjaxRequest”，{
所选国家/地区名称：$users\u country，
所选城市名称：$users\u city
})
});

您需要使用ajax。jQuery为您提供了这方面的帮助

---

Re:OP edit-请尝试以下代码：

$.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");
});

---

创建一个页面作为国家/城市数据的请求处理程序，然后使用Ajax将国家/城市字段发布到页面中。让处理程序根据表单字段输出所需的数据。使用javascript将返回的数据插入选项卡中

请求处理程序示例：

class GeoData(webapp.RequestHandler):
    def post(self):    
        country = self.request.get('selected_country')
        city = self.request.get('selected_city')
        data = retrieve_my_data(country,city)            
        self.response.out.write(data)

---

感谢您的回复。我尝试了您给出的回复。我可以看到javascript成功地进入了我的“post”方法，但我无法将数据从javascript发送到我的python代码。我已经放置了代码

<!-- 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>

$.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");
});

class GeoData(webapp.RequestHandler):
    def post(self):    
        country = self.request.get('selected_country')
        city = self.request.get('selected_city')
        data = retrieve_my_data(country,city)            
        self.response.out.write(data)