I got this django country, state, city dropdown code and changed the mysql db and tables for my use, thisi is views.py:
this is index.html:
this is the image of dropdown window when i click the button:
https://ibb.co/GQxC4Yc
# -*- coding: utf-8 -*-
from __future__ import unicode_literals
from django.template import RequestContext
from django.shortcuts import render
from django.http import HttpResponse
import mysql.connector
# Create your views here.
#index page where the form and result is populated.
def index(request):
cnx = mysql.connector.connect(user='root', password="rahul", host="localhost", database='quran')
cursor = cnx.cursor()
query="Select surah_name,id from surah"
cursor.execute(query)
country=cursor.fetchall()
context={"country":country
}
cnx.close()
return render(request,"index.html",context)
# to populate state dropdown when country is selected.
def state_view(request,id):
cnx = mysql.connector.connect(user='root', password="rahul", host="localhost", database='quran')
cursor = cnx.cursor()
query="select ayath,id from ayaths where surah_id="+str(id)
cursor.execute(query)
states=cursor.fetchall()
context={"states":states
}
cnx.close()
return render(request,"state.html",context)
# to populate city dropdown when state is selected.
def city_view(request,id):
cnx = mysql.connector.connect(user='root', password="rahul", host="localhost", database='quran')
cursor = cnx.cursor()
query="select page,id from pages where id="+str(id)
cursor.execute(query)
cities=cursor.fetchall()
if cities:
context={"cities":cities
for citit in cities:
print("page = ", row[2])
}
else:
context={"cities":["",0]
}
cnx.close()
return render(request,"city.html",context)
# populate the Country,State,City on the Index page.
def location_view(request,conid,sid,cid):
cnx = mysql.connector.connect(user='root', password="rahul", host="localhost", database='quran')
cursorCon = cnx.cursor()
cursorS = cnx.cursor()
cursorC = cnx.cursor()
query=["select surah_name from surah where id="+str(conid),"select ayath from ayaths where id="+str(sid),"select page from pages where id="+str(sid)]
cursorCon.execute(query[0])
country=cursorCon.fetchone()
cursorS.execute(query[1])
state=cursorS.fetchone()
cursorC.execute(query[2])
city=cursorC.fetchone()
html="Country : "+str(country[0])+"</br>State : "+str(state[0])+"</br>City : "+str(city[0])
cnx.close()
return HttpResponse(html)
def location_view2(request,conid,sid):
cnx = mysql.connector.connect(user='root', password="rahul", host="localhost", database='quran')
cursorCon = cnx.cursor()
cursorS = cnx.cursor()
query=["select surah_name from surah where id="+str(conid),"select ayath from ayaths where id="+str(sid)]
cursorCon.execute(query[0])
country=cursorCon.fetchone()
cursorS.execute(query[1])
state=cursorS.fetchone()
html="Country : "+str(country[0])+"</br>State : "+str(state[0])
cnx.close()
return HttpResponse(html) this is index.html:
<!DOCTYPE html>
<html>
<head>
{% load static %}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="{% static 'jquery.min.js' %}"> </script>
<script src="{% static 'main.js' %}"></script>
<link rel="stylesheet" type="text/css" href="{% static 'style.css' %}" />
</head>
<body>
<form method="post" action="" name="form1" id="locationform">{%csrf_token%}
<center>
<table width="45%" cellspacing="0" cellpadding="0">
<tr>
<td width="75">Country</td>
<td width="50">:</td>
<td width="150">
<select name="country" onChange="getState(this.value)">
<option value="Select Country">Select Country</option>
{%for con in country%}
<option value="{{con.1}}">{{con.0}}</option>
{%endfor%}
</select>
</td>
</tr>
<tr>
<td>State</td>
<td width="50">:</td>
<td >
<div id="statediv">
<select name="state">
<option value="">Select State</option>
</select>
</div>
</td>
</tr>
<tr>
<td>City</td>
<td width="50">:</td>
<td>
<div id="citydiv">
<select name="city" >
<option value="">Select City</option>
</select>
</div>
</td>
</tr>
</table>
<input type="submit" value="Submit" onclick="result()">
<div id="result"></div>
</center>
</form>
</body>
</html>and this is city.html:<select name="city">
{%for city in cities%}
<option value="{{city.1}}">{{city.0}}</option>
{%endfor%}
</select>when i click the button from index.html it prints the value of all three dropdown menu as shown in the image bellow how i can do this when i click the button should open the the third drop down menu which is a html page.this is the image of dropdown window when i click the button:
https://ibb.co/GQxC4Yc