您好,登錄后才能下訂單哦!
這篇文章將為大家詳細講解有關怎么在Django中使用ajax對數據進行交互,文章內容質量較高,因此小編分享給大家做個參考,希望大家閱讀完這篇文章后對相關知識有一定的了解。
將jquery文件拷貝到static/js/目錄下
打開booktest/views.py文件,定義視圖area1,用于顯示下拉列表
#提供顯示下拉列表的控件,供用戶操作 def area1(request): return render(request,'booktest/area1.html')
打開booktest/urls.py文件,配置url
url('^area1/$',views.area1),
在templates/booktest/目錄下創建area1.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="/static/js/jquery-1.12.4.min.js"></script> <script> $(function () { $.get('/sheng/',function (data) {//{slist:[]} var slist=data.slist;//[{},{},{}...] var sheng=$('#sheng'); $.each(slist,function (i,n) { //n==>{id:,title:} sheng.append('<option value="'+n.id+'">'+n.title+'</option>') }); }); $('#sheng').change(function () { var sid=$(this).val(); if(sid!='0'){ $.get('/shi/',{'sid':sid},function (data) { var slist=data.slist; var shi=$('#shi').empty().append('<option value="0">請選擇</option>'); $('#qu').empty().append('<option value="0">請選擇</option>'); $.each(slist,function (i,n) { shi.append('<option value="'+n.id+'">'+n.title+'</option>'); }); }); } }); $('#shi').change(function () { var sid=$(this).val(); if(sid!='0'){ $.get('/shi/',{'sid':sid},function (data) { var slist=data.slist; var shi=$('#qu').empty().append('<option value="0">請選擇</option>'); $.each(slist,function (i,n) { shi.append('<option value="'+n.id+'">'+n.title+'</option>'); }); }); } }); }); </script> </head> <body> <select id="sheng"> <option value="0">請選擇</option> </select> <select id="shi"> <option value="0">請選擇</option> </select> <select id="qu"> <option value="0">請選擇</option> </select> </body> </html>
運行服務器,在瀏覽器中輸入如下網址
http://127.0.0.1:8000/area1/
瀏覽效果如下圖
打開booktest/views.py文件,定義視圖sheng,用于獲取省信息
url('^sheng/$',views.sheng),
from django.http import JsonResponse def sheng(request): slist=AreaInfo.objects.filter(aParent__isnull=True) ''' [{id:,title:},{},{}] ''' slist2=[] for s in slist: slist2.append({'id':s.id,'title':s.atitle}) return JsonResponse({'slist':slist2})
打開booktest/urls.py文件,配置url
url('^sheng/$',views.sheng),
在瀏覽器中輸入如下網址
http://127.0.0.1:8000/sheng/
瀏覽效果如下圖
打開booktest/views.py文件,定義視圖shi,用于根據編號獲取對應的子級信息,如果傳遞的是省編號則獲取市信息,如果傳遞的是市編號則獲取區縣信息
#根據pid查詢子級區域信息 def shi(request): sid=request.GET.get('sid') slist=AreaInfo.objects.filter(aParent_id=sid) slist2=[] for s in slist: slist2.append({'id':s.id,'title':s.atitle}) return JsonResponse({'slist':slist2})
打開booktest/urls.py文件,配置url
url('^shi/$',views.shi),
在瀏覽器中輸入如下網址
瀏覽效果如下圖
在瀏覽器中輸入如下網址
http://127.0.0.1:8000/shi/
關于怎么在Django中使用ajax對數據進行交互就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。