Django--ajax

Posted 大亮头

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Django--ajax相关的知识，希望对你有一定的参考价值。

需求：

前端通过ajax把数据提交到后台

1、单条提交

html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<body>
    <input type="button" value="ajax提交" onclick="AjaxSubmit();">
    <!--数据应该从标签里获取，这里就不做了，设定了几个值提交。-->
    <script src="/static/js/jquery-2.1.4.min.js"></script>
    <script type="text/javascript">
        function AjaxSubmit(){
            var host=‘1.1.1.1‘;
            var port=‘111‘;
            $.ajax({
                url:‘/ajax_data/‘,
                type:‘POST‘,
                data:{h:host,p:port},
                success: function (arg) {
 
                }
            });
        }
    </script>
</body>
urls.py
1
2
3
4
5
from app01 import views
urlpatterns = [
    url(r‘^admin/‘, admin.site.urls),
    url(r‘^ajax_data/‘, views.ajax_data),
]
app01/views.py
1
2
3
def ajax_data(request):
    print request.POST
    return HttpResponse(‘ok‘)
IDE

技术分享


2、数组提交

html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<input type="button" value="ajax提交" onclick="AjaxSubmitSet();">
    <!--数据应该从标签里获取，这里就不做了，设定了几个值提交。-->
    <script src="/static/js/jquery-2.1.4.min.js"></script>
    <script type="text/javascript">
        function AjaxSubmitSet(){
            var hosts=[{‘ip‘:‘1.1.1.1‘,‘port‘:‘111‘},{‘ip‘:‘2.2.2.2‘,‘port‘:‘222‘}];
            $.ajax({
                url:‘/ajax_data_set/‘,
                type:‘POST‘,
                data:{data:hosts},
                success: function (arg) {
 
                }
            });
        }
    </script>
urls.py
1
2
3
4
5
from app01 import views
urlpatterns = [
    url(r‘^admin/‘, admin.site.urls),
    url(r‘^ajax_data_set/‘, views.ajax_data_set),
]
app01/views.py

1
2
3
def ajax_data_set(request):
    print request.POST
    return HttpResponse(‘ok‘)
IDE

刷新页面，点击ajax提交按钮，IDE打印出了如下信息：

技术分享
        显然不是我们想要的！！！

修改html中ajax提交方式

技术分享

这样的数据格式我们就方便取值了。

3、返回值

标准的输出：{status：‘true‘，error:‘‘}

app01/views.py

1
2
3
4
5
6
7
8
9
import json
def ajax_data_set(request):
    ret = {‘status‘:True,‘error‘:""}    #默认ajax成功返回的格式
    try:                                #如果提交成功，打印提交的数据，返回ret
        print request.POST
    except Exception,e:                 #当出错异常，修改返回值
        ret[‘status‘]=False
        ret[‘error‘]=str(e)
    return HttpResponse(json.dumps(ret))    #只能返回字符串
html中的ajax
1
2
3
4
5
6
7
8
9
10
success: function (arg) {
    //返回值是字符串，把它先转化成字典
    //相当于json.loads()，parseJSON将字符串转换成对象
    var callback_dict= $.parseJSON(arg);
    if(callback_dict.status){
        alert(‘成功‘);
    }else{
        alert(callback_dict.error);
    }
}

browser

技术分享

制造异常app01/views.py
1
2
try:                               
    print request.PO                #故意写错，抛出异常。
browser?

技术分享













































以上是关于Django--ajax的主要内容，如果未能解决你的问题，请参考以下文章

Django - AJAX - 如何提交多个表单？

Django/Ajax 发送“无”值来查看

django ajax javascript不工作

django - ajax - 从 jquery/ajax 调用 python 函数

Django ajax

Django ajax 错误