amazeui分页
<link rel="stylesheet" href="../../static/css/manage/amazeui.min.css" />
<script src="../../static/js/manage/jquery-2.1.4.js"></script>
<script src="../../static/js/manage/amazeui.min.js"></script>
<script type="text/javascript" src="../../static/js/manage/amazeui.page.js"></script>
<div class="row">
<div id="page"></div>
</div>
function loadImg(curpage, isfirst) {
g_first = isfirst;
$.ajax({
type: "post",
url: "/mpapi/get_videos",
data: {
"page": curpage,
"count": item_count
},
dataType: "json",
success: function(ret) {
var htm = "";
if(ret["result"] == 1) {
// $.AMUI.progress.set(0.4);
video_info = ret.video
console.log(video_info)
$.each(ret["video"], function(i, v) {
var t = timestp2DateStr(v.ctime);
var statu;
var color;
console.log(v.status);
if(v.status){
statu = "已上架"
bstatus = "下架"
color = "dColor"
}else{
statu = "未上架"
bstatus = "上架"
color = "pColor"
}
htm += `<tr tind=${index++}>
<td class="am-text-middle">
<img src="${v.main_img}" class="video_url">
</td>
<td class="am-text-middle video_name">${v.name}</td>
<td class="am-text-middle video_desc">${v.desc}</td>
<td class="am-text-middle video_desc">${t}</td>
<td class="am-text-middle video_link">${v.url}</td>
<td class="am-text-middle ${color}">
${statu}
</td>
<td class="am-text-middle">
<div class="tpl-table-black-operation">
<a href="javascript:;" onclick="pub_article(\'${v.video_id}\',\'${statu}\')">
<i class="am-icon-pencil"></i>
${bstatus}
</a>
<a href="javascript:;" onclick="edit_btn_event(\'${i}\')">
<i class="am-icon-pencil"></i> 编辑
</a>
<a href="javascript:;" class="tpl-table-black-operation-del" onclick="btn_delete(\'${i}\')">
<i class="am-icon-trash"></i> 删除
</a>
</div>
</td>
</tr>`;
})
$("#video_table").html(htm);
var page_count = parseInt(ret.count / item_count) + (ret.count % item_count == 0 ? 0 : 1);
if(g_first){page_plugin(page_count);}
} else if(ret["result"] == -301){
window.location.href = "/manage/login"
return
}else{console.log("无数据");
$("#video_table").html(htm);}
},
error: function(err) {
console.log(err);
}
})
}
var page_plugin = function(page_count) {
$("#page").page({
pages: page_count,
curr:curpage,
groups: 5,
first: "首页",
last: "尾页",
prev: false,
next: false,
jump: function(context, first) {
if(!first) {
curpage = context.option.curr;
loadImg(curpage,false);
}
}
})
}
amazeui分页的更多相关文章
- amazeui学习笔记--css(常用组件11)--分页Pagination
amazeui学习笔记--css(常用组件11)--分页Pagination 一.总结 1.分页使用:还是ul包li的形式: 分页组件,<ul> / <ol> 添加 .am-p ...
- ASP.NET MVC+EF在服务端分页使用jqGrid以及jquery Datatables的注意事项
引言: 本人想自己个博客网站出来,技术路线是用ASN.NET MVC5+EF6(Code First)+ZUI+各种Jquery插件,有了这个想法之后就开始选择UI,看了好多bootstrap的模板之 ...
- react搭配amazeui环境搭建
1.安装node https://nodejs.org/en/download/ 查看node npm版本 2.安装react 创建新的react单页面应用 npm install -g cre ...
- amazeui学习笔记一(开始使用2)--布局示例layouts
amazeui学习笔记一(开始使用2)--布局示例layouts 一.总结 1.样例分析(不要忘记,优先分析这个布局示例):有教你页面怎么布局的,实例中可以分析一波 2.响应式:对应meta标签中的v ...
- amazeui中内置的web组件有哪些且如何用
amazeui中内置的web组件有哪些且如何用 一.总结 一句话总结: 1.组件还是jquery.js+amazeui.js,和插件一样,准确的说是amazeui.css+jquery.js+amaz ...
- 记一次SQLServer的分页优化兼谈谈使用Row_Number()分页存在的问题
最近有项目反应,在服务器CPU使用较高的时候,我们的事件查询页面非常的慢,查询几条记录竟然要4分钟甚至更长,而且在翻第二页的时候也是要这么多的时间,这肯定是不能接受的,也是让现场用SQLServerP ...
- js实现前端分页页码管理
用JS实现前端分页页码管理,可以很美观的区分页码显示(这也是参考大多数网站的分页页码展示),能够有很好的用户体验,这也是有业务需要就写了一下,还是新手,经验不足,欢迎指出批评! 首先先看效果图: 这是 ...
- JdbcTemplate+PageImpl实现多表分页查询
一.基础实体 @MappedSuperclass public abstract class AbsIdEntity implements Serializable { private static ...
- MVC如何使用开源分页插件shenniu.pager.js
最近比较忙,前期忙公司手机端接口项目,各种开发+调试+发布现在几乎上线无问题了:虽然公司项目忙不过在期间抽空做了两件个人觉得有意义的事情,一者使用aspnetcore开发了个人线上项目(要说线上其实只 ...
随机推荐
- pgadmin连接 postgresql远程设置
背景:通过yum默认方式将pgsql10安装在centos7, pgsql 的配置文件在:/var/lib/pgsql/10/data. 配置文件:postgresql.conf 和 pg_hba.c ...
- 循环队列搜索 Search in Rotated Sorted Array
这里比较重要的是,不要一上来就判断mid 和 target有没有关系.因为数组是无序的,这样的判断毫无结论,只会搞的更复杂.应该先想办法判断出哪一侧是有序的. class Solution { pub ...
- 警惕 MySql 更新 sql 的 WHERE 从句中的 IN() 子查询时出现的性能陷阱
警惕 MySql 更新 sql 的 WHERE 从句中的 IN() 子查询时出现的性能陷阱 以下文章来源:https://blog.csdn.net/defonds/article/details/4 ...
- mysql学习二、SQL常用数据类型
一.常用数据类型 二.选择数据类型的原则: 1 业务需要 2 满足第一个条件下,需要存储空间最小的. 三.常用的选择数据类型思路:
- jenkins grunt 自动构建流程
1. grunt生成的压缩文件不建议上传到svn,src里的源码和grunt,npm的配置文件保存在svn里就够了2. grunt有watch任务,src里的文件改变了可以自动执行任务,比如压缩,3. ...
- MySQL 5.7自定义安装图文详解
本文教程为大家分享了mysql5.7安装配置方法,供大家参考,具体内容如下 mysql-installer-community-5.7.9.1各版本相关说明: mysql-installer-web- ...
- SVN添加用户
1. 找到svn安装路径 /svn/repositories/ (如果不知道,可以搜索 :find / -name svn或者是ps -ef | grep svn) 2.进入该目录的conf,其中包 ...
- IDEA连接数据库自动生成实体类
1.连接数据库 (1)按下图 , 点击view-----选择tool windows----------选择database并点击 (2)弹出Database窗口,点击加号--------- ...
- LINUX | 谷歌云开启SSH及设置root密码
一.设置root密码 1.先选择从浏览器打开ssh连接服务器 2.切换到root账号 sudo -i 3.设置root密码 passwd 然后会要求输入新密码,然后再重复一次密码,输入密码的时候不会显 ...
- go语言变量
变量可以通过变量名访问 Go 语言变量名由字母.数字.下划线组成,其中首个字符不能为数字 声明变量的一般形式是使用 var 关键字: var identifier type 变量声明 1. 指定变量类 ...