通过JavaScript调用动态填充模型属性

Question

问题描述：

1] 我有一个模型，里面有国家和城市的属性。

class UserReportedData(db.Model):
  #country selected by the user, this will also populate the drop down list on the html page
  country = db.StringProperty(default='Afghanistan',choices=['Afghanistan','Aring land    
  Islands','Albania'])
  #city selected by the user
  city = db.StringProperty()

相关的表单。

class UserReportedDataForm(djangoforms.ModelForm):

    class Meta:
       model = UserReportedData

2] 在StackOverflow的帮助下（感谢Chris，帖子链接：使用GeoIP与Google App Engine和Python），我弄明白了如何在HTML页面中用JavaScript来获取用户的国家和城市。下面的代码可以成功地在页面上显示国家和城市的值。

<!-- including the  geoip javascript library -->
<script  
  src="http://j.maxmind.com/app/geoip.js"
  type="text/javascript">
</script>

<script type="text/javascript">
   if (window.geoip_country_name) {
    document.write(geoip_country_name())
    document.write(geoip_city())
   }
</script>

3] 现在，当页面显示时，国家和城市的文本框以及默认值是来自Django表单的（抱歉，由于限制无法发布图片）。

问题：

我希望用户的国家和城市数据能够自动填入国家和城市的文本框中。因此，Python的表单或模型应该能够调用JavaScript代码，获取用户的国家和城市数据。

谢谢，

[编辑#1] 根据@Haochi建议的方式进行编辑。

以下是Django表单生成的ID。

<select name="country" id="id_country">
<input type="text" name="city" id="id_city" />

在HTML页面中尝试了以下JavaScript。

  <script type="text/javascript">
  if (window.geoip_country_name) {
     document.getElementById("id_country").value = geoip_country_name();
     document.getElementById("id_city").value = geoip_city();
     document.write("this is a javasctipt print"); /* this prints properly*/
     document.write(document.getElementById("id_country").value);
     document.write(document.getElementById("id_city").value);
    }
  </script>

不过，这并没有正确填充id_country和id_city文本框的值。

[编辑#3] 这是HTML文件的样子，我现在已经把GEOIP的计算从服务器端移到了客户端。

<!-- Text box for city, later on in the design this will be a drop down box -->
<p> Select City: </p>
<div>
  <input type="text" name="city" id="city"> 
  <!-- By default, we will select users city -->
  <script type="text/javascript" language="JavaScript">
     document.getElementById("city").value = geoip_city()
  </script>     
</div>  

<p> Select Country: </p>
<select name="selCountry" id="country">
<!-- By default, we will select users country -->
<script type="text/javascript" language="JavaScript">
    document.write("<option value=\"" + geoip_country_name() + "\" selected>"
</script>
<option value="United States">
    United States
 </option>
 <option value="United Kingdom">
    United Kingdom
 </option>

我认为最佳做法是把所有的JavaScript放到一个单独的文件中，我需要尝试一下，并相应地修改HTML代码。

Answer 1

我写了一个Python类，用来查找用户所在的国家和城市。这个功能是可以正常工作的，如果有人发现了问题或者有什么可以改进的地方，请告诉我。

from google.appengine.api import urlfetch

#class that is used for geo ip functionality of the application
class GeoIpLocator:

#method that will return the country city dictionary based on users GeoIP location
#dictionary format {"country_name": "USA", "city":"chicago"}
def get_country_city_dictionary(self):
    url = "http://j.maxmind.com/app/geoip.js"
    result = urlfetch.fetch(url)
    if result.status_code == 200:
        keep = ['country_name', 'city']
        results = dict([x for x in re.findall("geoip_(.*?)\(.*?\'(.*?)\'", result.content) if x[0] in keep])
        results.update({'source': 'mmind'})
        if results:
            return results
        else:
            return {}       

[编辑#1] 这个方法是行不通的，它会返回运行这个Python应用的服务器的IP地址，感谢@Calvin指出这一点。

Answer 2

假设你有两个输入框，它们的ID分别是country和city：

document.getElementById("country").value = geoip_country_name()
document.getElementById("city").value = geoip_city()