jQuery插件datatables如何使用
这篇文章主要介绍了jQuery插件datatables如何使用的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇jQuery插件datatables如何使用文章都会有所收获,下面我们一起来看看吧。
站在用户的角度思考问题,与客户深入沟通,找到山丹网站设计与山丹网站推广的解决方案,凭借多年的经验,让设计与互联网技术结合,创造个性化、用户体验好的作品,建站类型包括:成都网站设计、网站建设、企业官网、英文网站、手机端网站、网站推广、主机域名、网页空间、企业邮箱。业务覆盖山丹地区。
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'), )
最后就是模板文件内容了:
My Attr Heading $(document).ready(function() { $('#example').dataTable( { "processing": true, "ajax": { "processing": true, "url": "{% url 'my_ajax_url' %}", "dataSrc": "" }, "columns": [ { "data": "fields.someAttr }, { "data": "pk" } ] } ); } );
其中url指定你的view函数名称,columns指定要显示的列,这样数据就以表格的形式展示出来了,要想美观记得自己要上样式,推荐bootstrap,datatables是一次把数据全部加载到前端来处理,所以如果你加载的条目非常多,就会有停顿感,必须要加上bServierSide参数。
关于“jQuery插件datatables如何使用”这篇文章的内容就介绍到这里,感谢各位的阅读!相信大家对“jQuery插件datatables如何使用”知识都有一定的了解,大家如果还想学习更多知识,欢迎关注创新互联行业资讯频道。
网页标题:jQuery插件datatables如何使用
当前网址:http://pwwzsj.com/article/jjsgei.html