django 返回json数据,jquery获取并且打印出来

视图代码:

import json
 
def test(request):
    pie_list = [[u‘北京‘,50],[u‘上海‘,20],[u‘广州‘,30]]
    t_country = [u‘北京‘,u‘上海‘,u‘广州‘]
    t_country_count = [50,20,30]
    data_dic = {‘pie_g‘:pie_list,‘t_country‘:t_country,‘t_county_count‘:t_country_count}
     
    return HttpResponse(json.dumps(data_dic))
模板视图:

def moban(request):
    return  render_to_response(‘moban.html‘)

django URL配置

url(r‘^test/$‘, test),
url(r‘^moban/$‘, moban),

设置一个模板,模板内容如下:

<html>
<head>
<script type="text/javascript" src="/static/js/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $.get("/test/",function(data,status){
        $("p").append(data + "</br>");
    });
  });
});
</script>
</head>
<body>
<button>向页面发送 HTTP GET 请求,然后获得返回的结果</button>
<p></p>
</body>
</html>
<!--#####################下面的方法也能获取到json数据 ,可以理解为模板2-->
<script type="text/javascript" src="/static/js/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function() {
  $("button").click(function(){
    $.getJSON(‘/test/‘, { }, function (data) {
        $("p").append(data.pie_g + "</br>"  +data.t_country + "</br>"+ data.t_county_count)
    });
  });
});
</script>
<button>向页面发送 HTTP GET 请求,然后获得返回的结果</button>
<p></p>

页面调试的时候建议使用火狐的firebug,很方便的!

最后附上一张效果图

时间: 2024-10-27 19:53:55

django 返回json数据,jquery获取并且打印出来的相关文章

Django返回json数据用法示例

最近在写前端ajax发送请求到后台,结果数据提交成功,但是一直未执行成功回调函数,经过多番查找资料,终于找到答案. 本文实例讲述了Django返回json数据用法.分享给大家供大家参考,具体如下: 1.前端.jQuery发送GET请求,并解析json数据.getJSON方法可参考这里. ? 1 2 3 4 5 url = "http://example/?question=" + question + "&rand=" + Math.random(); $.

django 返回json数据

1 from django.core import serializers 2 3 @login_required 4 def ajax_get_data(request): 5 json_data = serializers.serialize("json", MyModel.objects.all()) 6 return HttpResponse(json_data,content_type="application/json")

jQuery通过Ajax向PHP服务端发送请求并返回JSON数据

ON(JavaScript Object Notation) 是一种轻量级的数据交换格式.易于人阅读和编写,同时也易于机器解析和生成.JSON在前后台交互的过程中发挥着相当出色的作用.请接着往下看教程. XHTML  <ul id="userlist">    <li><a href="#" rel="1">张三</a></li>    <li><a href=&quo

用ajax获取后台数据,返回json数据,怎么在前台使用?

用ajax获取后台数据,返回json数据,怎么在前台使用呢? 后台 C# code ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 if (dataType == "SearchCustomer")                 {                     int ID;                     if (Int32.TryParse(CustomerID, out ID))                     {    

jQuery调用WebService返回JSON数据

相信大家都比较了解JSON格式的数据对于ajax的方便,不了解的可以从网上找一下这方面的资料来看一下,这里就不多说了,不清楚的可以在网上查一下,这里只说一下因为参数设置不当引起的取不到返回值的问题. 在用jQuery调用WebService的时候,它contentType默认为 以下是WebService服务端的代码: 1 using System; 2 using System.Collections.Generic; 3 using System.Linq; 4 using System.W

Jquery 返回json数据在IE浏览器中提示下载的问题

Jquery 返回json数据,IE浏览器提示下载的问题,当提交完数据后返回的本来是json数据的,在火弧里测试正常,解决方法如下 今天遇到Jquery 返回json数据,IE浏览器提示下载的问题,当提交完数据后返回的本来是json数据的,在火弧里测试正常,但是IE里老是提示保存,在网上搜索了下,大部分是说将ContentType设置为"text/xml“本人测试了下,返回值为undefined, 原返回值设定:context.Response.ContentType = "appli

jquery实现ajax,返回json数据

jquery实现ajax可以调用几种方法 我经常用的是$get(url,data,callback,type)方法 其中url是异步请求的页面(可以是.ashx文件),data是参数,callback是回调函数,而type是返回数据的类型.type有xml,html,json,text等. 首先,页面引用jquery.js 在页面写ajax处理的js函数 1 2 3 4 5 6 7 8 9 10 11 12 13 function initMeeting() {             $.ge

jquery序列化from表单使用ajax提交返回json数据(使用struts2注解result type = json)

1.action类引入struts2的"json-default"拦截器栈 @ParentPackage("json-default") //示例 @ParentPackage(WapBaseAction.WAP_PACKAGE) //WAP_PACKAGE继承了json-default @Namespace("/") public class ModifyResumeAction extends WapBaseAction {... [emai

通过jquery的ajax异步请求接收返回json数据

jquery的ajax异步请求接收返回json数据方法设置简单,一个是服务器处理程序是返回json数据,另一种就是ajax发送设置的datatype设置为jsonp格式数据或json格式都可以. 代码示例如下: $('#send').click(function () { $.ajax({ type : "GET", url : "a.php", dataType : "jsonp", success : function (data) { $.