首先在html页面定义好相关长度的行和列,假设table的id=data-table“”
使用jquery DataTable在js中这么写
$(function() { $('#data-table').DataTable( { order : [ [ 1, 'desc' ] ], ajax : { url : "/products", type : 'GET', dataSrc : "" }, columns : [ { data : "id" }, { data : "id" }, { data : "title", defaultContent : "" }, { data : "sell_point", defaultContent : "" }, { data : "price", defaultContent : "" },{ data : "number", defaultContent : "" },{ data : "image", defaultContent : "" },{ data : "cid", defaultContent : "" },{ data : "id" }], columnDefs : [{ targets : [ 0 ], orderable : false, render : function(id, type, row, meta) { return '<input id="input-' + id + '" type="checkbox" name="ids" value=' + id + '><label for="input-' + id + '"></label>'; } },{ targets: [8], render: function(data, type, row, meta) { return '<a title="编辑" href="javascript:;" rel="external nofollow" rel="external nofollow" onclick="product_edit('+ data +')" ><i class="Hui-iconfont"></i></a><a title="删除" href="javascript:;" rel="external nofollow" rel="external nofollow" onclick="product_del(' + data +')" class="ml-5" ><i class="Hui-iconfont"></i></a>' } }] }); });
本文名称:使用jqueryDataTable和ajax向页面显示数据列表的方法-创新互联
文章转载:https://www.cdcxhl.com/article14/hpsge.html
成都网站建设公司_创新互联,为您提供外贸建站、静态网站、手机网站建设、做网站、ChatGPT、网站改版
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联