jQuery 的插件 dataTables 是一個優秀的表格插件，提供了針對表格的排序、瀏覽器分頁、伺服器分頁、篩選、格式化等功能。
如何把資料庫中的資料以表格的形式展示到前端，實現有很多方法，最近用jquery的datatables插件來實現了發現還是比較簡單的，今天我們來看一個例子，來說明這個插件的使用，基本原理是view函數從資料庫讀出數據，jquery透過ajax取得數據並在前端展示出來，我們先定義一個models.py,如下：
from django.dbimport models class MyModel(models.Model): someAttr = models.CharField() def __unicode__(self): return self.someAttr
然後定義我們的view函數：
fromdjango.httpimportHttpResponse
fromdjango.coreimportserializers
from .modelsimportMyModel
defmyModel_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：
from django.conf.urlsimport patterns, url
urlpatterns = patterns('myapp.views',
url(regex=r'^$',
view='myModel_asJson',
name='my_ajax_url'),
)最後就是範本文件內容了：
<tablecellpadding="0" cellspacing="0" border="0" id="example">
<thead>
<tr><th>My Attr Heading</th></tr>
</thead>
<tbody></tbody>
</table>
<scripttype="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參數。
關於jQuery外掛程式datatables使用教學小編就跟大家介紹到這裡，希望對大家有幫助！
