如何把数据库中的数据以表格的形式展示到前端，实现有很多方法，最近用jquery的datatables插件来实现了发现还是比较简单的，今天我们来看一个例子，来说明这个插件的使用，基本原理是view函数从数据库中读出数据，jquery通过ajax获取数据并在前端展示出来，我们先定义一个models.py,如下：
|
1 2 3 4 5 6 7 |
from django.db import models class MyModel(models.Model): someAttr = models.CharField() def __unicode__(self): return self.someAttr |
然后定义我们的view函数：
|
1 2 3 4 5 6 7 8 |
from django.http import HttpResponse from django.core import serializers from .models import MyModel def myModel_asJson(request): object_list = MyModel.objects.all() json = serializers.serialize('json', object_list) return HttpResponse(json, content_type='application/json') |
因为datatables接收的是json格式数据，所以从数据库中读出的数据要序列化，就是这句：
json = serializers.serialize(‘json’, boject_list)
添加下url.py：
|
1 2 3 4 5 6 7 |
from django.conf.urls import patterns, url urlpatterns = patterns('myapp.views', url(regex=r'^$', view='myModel_asJson', name='my_ajax_url'), ) |
最后就是模板文件内容了：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<table cellpadding="0" cellspacing="0" border="0" id="example"> <thead> <tr><th>My Attr Heading</th></tr> </thead> <tbody></tbody> </table> <script type="text/javascript" language="javascript" class="init"> $(document).ready(function() { $('#example').dataTable( { "processing": true, "ajax": { "processing": true, "url": "{% url 'my_ajax_url' %}", "dataSrc": "" }, "columns": [ { "data": "fields.someAttr }, { "data": "pk" } ] } ); } ); </script> |
其中url指定你的view函数名称，columns指定要显示的列，这样数据就以表格的形式展示出来了，要想美观记得自己要上样式，推荐bootstrap，datatables是一次把数据全部加载到前端来处理，所以如果你加载的条目非常多，就会有停顿感，必须要加上bServierSide参数。