zoukankan      html  css  js  c++  java
  • Ajax请求示例

    模板

     1                 {% for row in host_list %}
     2                 <tr>
     3                     <td class="c1">{{ row.id }}</td>
     4                     <td>{{ row.servername }}</td>
     5                     <td>{{ row.serverip }}</td>
     6                     <td>{{ row.serverpassword }}</td>
     7                     <td>编辑</td>
     8                     <td class="i1">删除</td>
     9                 </tr>
    10                 {% endfor %}
    11                 </table>
    12         </div>
    13     </div>
    14 
    15 <script src="/static/jquery-3.1.1.js"></script>
    16 <script>
    17     $(".i1").each(function () {
    18         $(this).click(function () {
    19             var b = $(this).parent().find("td").get(0).innerText;
    20             console.log(b);
    21             $(this).parent().remove();
    22             $.ajax({
    23                 url:'/host-ajax',
    24                 type:"POST",
    25                 data:{"id":b},
    26                 success:function (data) {
    27                     var obj = JSON.parse(data);
    28                     alert(obj.data)
    29                 }
    30             })
    31         })
    32     })
    33 </script>

    路由系统

    1 url(r'^host-ajax', views.host_ajax),

    视图函数

     1 def host_ajax(request):
     2     import  json
     3     res = {"status":True,"error":None,"data":None}
     4     try:
     5         if request.method =="POST":
     6             print("执行 post方法 》》")
     7             nid = request.POST.get("id")
     8             print("nid:>>>",nid)
     9             models.HostInfo.objects.filter(id=nid).delete()
    10             res["data"] = "delete success"
    11         else:
    12             pass
    13     except Exception as e:
    14         res["status"]= False
    15         res["error"] = "rquest error"
    16     return HttpResponse(json.dumps(res))

    Ajax 

                $.ajax({
                url: '/host',                                                #要提交到那个URL,触发那个函数
                type: "POST",                                             #提交方式
                data: {'k1': 123,'k2': "root"},                      #提交的数据
                success: function(data){                             #回调函数,即只有服务器端返回信息以后会自动执行,必要带一个参数,这个参数代表服务端返回的字典
                    // data是服务器端返回的字符串
                    var obj = JSON.parse(data);                    #把服务器端返回的字符串变成一个json字典的格式对象
                }
            })
            
        
            建议:永远让服务器端返回一个字典
            
            return HttpResponse(json.dumps(字典))

  • 相关阅读:
    第九篇装饰器基本原理
    第八篇迭代器协议和生产器
    python第六篇文件处理类型
    Python开发【第十篇】:模块
    习题练习
    2.2.6 集合
    第七篇 python基础之函数,递归,内置函数
    Python开发【第五篇】:Python基础之杂货铺
    Python开发【第四篇】:Python基础之函数
    详解CSS position属性
  • 原文地址:https://www.cnblogs.com/liruixin/p/6252635.html
Copyright © 2011-2022 走看看