Django - Country -> State-> City 下拉列表-6ren

Django - Country -> State-> City 下拉列表

转载作者：行者123 更新时间：2023-12-04 12:52:50

25

4

我一直在尝试创建一个 3 列下拉列表作为国家、州、城市。

州列表将根据选择的国家/地区显示。同样的事情发生在城市取决于选择哪个州。

我的数据库如下。如果选择了一个国家，则州将根据国家/地区显示。同样的事情发生在城市

成员将从已经存在的国家、州、城市数据库中选择他的国家、州和城市

from django.db import models


class Member(models.Model):

       residing_country = models.CharField(max_length=50)
       residing_state = models.CharField(max_length=50)
       residing_city = models.CharField(max_length=50)

class Country(models.Model):

         country= models.CharField(max_length=20)

class State(models.Model):

         state=models.CharField(max_length=20)
         country = models.ForeignKey(Country)       

class City(models.Model):

        city=models.CharField(max_length=20)
        state=models.ForeignKey(State)

最佳答案

您也可以尝试不使用 ajax 调用:

<html>
<head> 
<title>Demo by kishan Radadiya</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
        // Countries
        var country_arr = new Array("Select Country","AUSTRALIA","INDIA","NEW ZEALAND","USA","UAE","MAURITIUS");

        $.each(country_arr, function (i, item) {
            $('#country').append($('<option>', {
                value: i,
                text : item,
            }, '</option>' ));
        });

        // States
        var s_a = new Array();
        s_a[0]="Select State";
        s_a[1]="Select State|QUEENSLAND|VICTORIA";
        s_a[2]="Select State|ANDHRAPRADESH|KARNATAKA|TAMILNADU|DELHI|GOA|W-BENGAL|GUJARAT|MADHYAPRADESH|MAHARASHTRA|RAJASTHAN";
        s_a[3]="Select State|AUCKLAND";
        s_a[4]="Select State|NEWJERSEY|ILLINOIS";
        s_a[5]="Select State|DUBAI";
        s_a[6]="Select State|MAURITIUS";

        // Cities
        var c_a = new Array();
        c_a['QUEENSLAND']="BRISBANE";
        c_a['VICTORIA']="MELBOURNE";
        c_a['ANDHRAPRADESH']="HYDERABAD";
        c_a['KARNATAKA']="BANGLORE";
        c_a['TAMILNADU']="CHENNAI";
        c_a['DELHI']="DELHI";
        c_a['GOA']="GOA";
        c_a['W-BENGAL']="KOLKATA";
        c_a['GUJARAT']="AHMEDABAD1|AHMEDABAD2|AHMEDABAD3|BARODA|BHAVNAGAR|MEHSANA|RAJKOT|SURAT|UNA";
        c_a['MADHYAPRADESH']="INDORE";
        c_a['MAHARASHTRA']="MUMBAI|PUNE";
        c_a['RAJASTHAN']="ABU";
        c_a['AUCKLAND']="AUCKLAND";
        c_a['NEWJERSEY']="EDISON";
        c_a['ILLINOIS']="CHICAGO";
        c_a['MAURITIUS']="MAURITIUS";
        c_a['DUBAI']="DUBAI";


        $('#country').change(function(){
            var c = $(this).val();
            var state_arr = s_a[c].split("|");
            $('#state').empty();
            $('#city').empty();
            if(c==0){
                $('#state').append($('<option>', {
                    value: '0',
                    text: 'Select State',
                }, '</option>'));
            }else {
                $.each(state_arr, function (i, item_state) {
                    $('#state').append($('<option>', {
                        value: item_state,
                        text: item_state,
                    }, '</option>'));
                });
            }
            $('#city').append($('<option>', {
                value: '0',
                text: 'Select City',
            }, '</option>'));
        });

        $('#state').change(function(){
            var s = $(this).val();
            if(s=='Select State'){
                $('#city').empty();
                $('#city').append($('<option>', {
                    value: '0',
                    text: 'Select City',
                }, '</option>'));
            }
            var city_arr = c_a[s].split("|");
            $('#city').empty();

            $.each(city_arr, function (j, item_city) {
                $('#city').append($('<option>', {
                    value: item_city,
                    text: item_city,
                }, '</option>'));
            });


        });
    });
</script>
</head>
<body>
<select name="country" id="country"></select> <br>
<select name="state" id="state"></select> <br>
<select name="city" id="city"></select>
</body>
</html>

关于Django - Country -> State-> City 下拉列表，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4071630/

25

4

0

文章推荐： r - 向 r 中的 xtabs 单元格添加百分号

文章推荐： gcc - 64 位平台上的 ELF 目标文件大小限制是多少？

文章推荐： css - 父选择器是否优先于 CSS 中的子选择器？

c# - 如何将字符串中的 [city] 替换为 [City]
我想将 [city]、[cIty]、[ciTY]、... 替换为 [City]。我认为正则表达式是一个很好的解决方案，但我不擅长正则表达式。尝试过的代码: var text = "[City] [
sql - 最好有一个字段 "City"或一个表 "City"？
我正在使用 Ruby on Rails 制作一个网站，我正在考虑数据库结构。这个网站很简单，我们列出了很多地方，并告诉他们来自哪个城市。例如“埃菲尔铁塔”/巴黎或“帝国大厦”/纽约对于数据库，哪
seo - 我是否需要 "Web Design [city-name]"和 "Website Design [city-name]"的页面，或者我可以使用 "Website Design [city-name]"对两者进行排名？
如果 Google 的关键字规划器向我显示关键字“Web Design [city-name]”获得约 880 次搜索，而“Website Design [city-name]”获得约 620 次搜索
javascript - 如何将结果值 city 插入/传递到输入字段值 =“city”
这个脚本很好用，它生成函数的town必须注册但是他生成so city 如何将值 #city 插入/传递到输入字段 value="cityname" $(document).ready( funct
php - SELECT * FROM city WHERE city LIKE '%value% %value%' ;
我有一个包含很多城市和两个名称相似的城市的数据库。荷斯坦州奥尔登堡和奥尔登堡(奥尔登堡) 我从 URL 获取城市示例网址: www.example.com/cityname/oldenburg-i
javascript - city.statename.data 生成错误无法读取 Object.city 中未定义的属性 'data'
Cannot read property 'data' of undefined at Object.city 问题是我正在动态调用状态，当我编写city.UP.data时，它显示正确的结果，当我在此
python - curr.execute ("""INSERT INTO CITY (name) values (%s) ;""",(cities)) 无法将列表插入数据库
我正在尝试将列表插入到 postgres 表中。在 try 中，它在这一行失败了: curr.execute("""INSERT INTO CITY (name) values (%s);""",(
c# - 将 lambda 转换为点分字符串，例如x => x.Address.City 变为 Address.City
我想转换引用对象属性或子属性的 lambda 表达式，例如x => x.Address.City 转换成字符串 Address.City。是否存在执行此操作的现有框架方法(MVC、EF、...？)，还
c# - Students.Where(x=>x.City == "Lahore").ToList(); 之间的差异Students.ToList().Where(x=>x.City == "Lahore");
这些 linq 查询有什么区别: Students.Where(x=>x.City == "Lahore").ToList(); Students.ToList().Where(x=>x.City =
ios - Xcode 10 - iOS 12 Simulator 位置模拟在 City Bicycle Ride/City Run/Freeway Drive 上失败
一天前我刚刚从 Xcode 9 更新到 Xcode 10，当我正要调试我的位置跟踪应用程序时才意识到我从未收到设备位置信息。所以我去 map 应用程序检查它是否只是我的应用程序的问题，但是当我将位置调
django-cities 数据导入不起作用
我安装了 django-cities 插件并在 settings.py 中设置了以下参数: CITIES_FILES = { 'city': { 'filena
1436. Destination City 旅行终点站
题目地址：https://leetcode-cn.com/problems/destination-city/ 题目描述给你一份旅游线路图，该线路图中的旅行线路用数组 paths 表示，其中 p
teamcity - 设置有关构建失败的电子邮件通知-Team City
我已经配置了Team City通过EC2发送电子邮件，并且工作正常，但是现在如何设置电子邮件帐户以发送服务器上所有构建作业的失败通知？我敢打赌，答案是盯着我，但我只是看不见。 TC 7.x BTW。
teamcity - Team City - 代理安装问题
将 TeamCity 构建代理安装在构建服务器之外的另一台机器上意味着什么？我的理解是，我需要“TeamCity 服务器安装”才能开始“代理安装”，对吗？现在我已经安装了带有 webUI 的 Team
teamcity - Team City - 在构建服务器上添加一个新的构建代理
我正在尝试在构建服务器(团队城市 6.5.5)上添加一个新的构建代理 - 我能够添加一个新的代理，但现在第一个已断开连接，第二个正在运行，我认为存在一些问题我指定的 ownport 和 ServerU
svn - Team City VCS错误收集更改
我在TeamCity项目中遇到以下错误: Error collecting changes for VCS repository 'MySvnRepository' Unable to get SVN
.net - Team City - 找不到兼容的代理
各位，我正在尝试使用团队城市。我完成了 7 个步骤中的 6 个步骤。现在是最后一步，在“Agent Requirements”选项卡下，它向我显示以下消息 Agents compatibility
deployment - Team City 多阶段部署的最佳实践是什么？
我们有 3 个环境: 开发:Team City 在此部署，以在主干上进行 Subversion 提交。暂存:用户接受是在此处针对候选版本的构建完成的。生产:当UAT通过时，通过的代码集部署在此处。
gradle - Team City 7支持的最新Gradle版本是什么？
Gradle支持的最新TeamCity 7版本是什么？最佳答案通过使用gradle包装器，您应该能够在Teamcity 7中使用最新的2.8 gradle版本关于gradle - Team Ci
codesmith - 在特定的构建步骤后如何运行Team City AssemblyInfo修补程序
生成项目时，通常的过程是，一旦将所有文件从源代码控制中拖放下来，就会运行AssemblyInfo修补程序。使用CodeSmith时，我们对此有疑问。问题在于我们有两个构建步骤。步骤1-运行Code

首页

博学

6Ren·AI

商城

Django - Country -> State-> City 下拉列表