使用JQuery中dataTable展示分页
2015-12-15 18:55
633 查看
$.ajax({ type: "POST", url: "<%=path%>/sdc/ss", dataType: 'json', success: function(msg){ $(".table-sort").dataTable({ "aaData": eval(msg.data.data), //需要展示数据数组 "aoColumns" : [ { "mDataProp" : "id", },{ "mDataProp" : "title", }, { "mDataProp" : "intro", }, { "mDataProp" : "is_open", }, { "mDataProp" : "is_open", } ], "fnRowCallback": function( nRow, aData, iDisplayIndex ) { if ( aData['is_open'] == 0 ) { $('td:eq(3)', nRow).html( "<span data='0' class='label label-success radius'>已启用</span>" ); }else{ $('td:eq(3)', nRow).html( "<span data='1' class='label label-defaunt radius'>已停用</span>" ); } var url="course-update.jsp?id="+aData['id']+"&title="+aData['title']+"&des="+aData['intro']; $('td:eq(4)', nRow).html( "<a title='修改科目' href='javascript:;' onclick=member_update(this,'修改科目','"+url+"','','510') class='ml-5' style='text-decoration:none'><i class='Hui-iconfont'></i></a>" ); return nRow; }, "bAutoWidth": true, //自适应宽度 "sPaginationType" : "full_numbers", "oLanguage" : { "sProcessing" : "正在加载中......", "sLengthMenu" : "每页显示 _MENU_ 条记录", "sZeroRecords" : "正在加载中......", "sEmptyTable" : "表中无数据存在!", "sInfo" : "当前显示 _START_ 到 _END_ 条,共 _TOTAL_ 条记录", "sInfoEmpty" : "显示0到0条记录", "sInfoFiltered" : "数据表中共为 _MAX_ 条记录", "sSearch" : "搜索", "oPaginate" : { "sFirst" : "首页", "sPrevious" : "上一页", "sNext" : "下一页", "sLast" : "末页" } } }); } });
PS:
在后台读取数据时可以使用"sAjaxSource": "${ctx}/plans?action=ajax","sServerMethod": "POST"实现ajax请求
因为我目前项目需求操作数据库中的json字段,所以需要先用ajax得到数据,在使用"aaData":展示我得到的数组
使用"fnRowCallback"属性,实现得到特定字符串的转换成用户易懂的文字,给用户提供一个更好的视觉效果
"aoColumns" 指定列的值,页面按照指定的顺序依次展示
相关文章推荐
- [jquery]高级篇--js绑定事件
- jquery跨域请求
- jquery 操作select
- [jquery]基础篇--this与$this区别
- jquery获取密码输入框内的密码
- [jquery]高级篇--获取div子元素
- jquery学习随笔(加载、原生DOM、jquer对象、剔除$所有权)
- $.makeArray()——JQuery
- Jquery插件easyUi实现表单验证示例
- ASP.NET MVC 使用Jquery Ajax实现登录
- jQuery Validate
- JQuery实现省市两级联动
- 如何写jQuery插件
- 代码成长记录之jquery this使用
- JQuery——Write less,do more
- jQuery custom content scroller自定义滚动条插件
- jQuery .tmpl() 用法示例介绍
- jQuery进行组件开发完整实例
- jQuery Media Plugin 现在插上实线的视频播放服务
- JQuery插件定义