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开发了个人线上项目(要说线上其实只 ...
随机推荐
- linux命令--xargs的使用
xargs 是给命令传递参数的一个过滤器,也是组合多个命令的一个工具. xargs 可以将管道或标准输入(stdin)数据转换成命令行参数,也能够从文件的输出中读取数据. xargs 也可以将单行或多 ...
- abp .net core area routes
添加area之后,一直访问不到area中的地址 1:Areas中的Controller必须要继承自 zzzControllerBase 2:该Controller必须加上 area特性
- git版本冲突解决
1. 使用git log命令查看所有的历史版本,获取某个历史版本的id,假设查到历史版本的id是139dcfaa558e3276b30b6b2e5cbbb9c00bbdca96. git log 2. ...
- Chrome 插件PPAPI 开发(一)环境搭建
前言:本文参考了其他已有的文章,在其基础上简化了一些没有必要的操作. 同时也记录一下chrome 插件ppapi环境的基础搭建.并且感谢已有文章作者的大无畏的分享精神! 在这附上参考文章链接:http ...
- 在CentOS7中安装scala-2.11.12
从官网下载scala的相关版本 https://www.scala-lang.org/download/2.11.12.html 解压安装包 tar zxf scala-.tgz -C /usr/sc ...
- ubuntu 外接显示器
xrandr --help xrandr # 列出显示器 sudo xrandr --output eDP-1 --off # 关闭eDP-1显示器 sudo xrandr --output ...
- Windows终端工具_MobaXterm
前言 有人喜欢小而美的工具,有人喜欢大集成工具.这里推荐一款增强型的Windows终端工具MobaXterm,它提供所有重要的远程网络工具(SSH,X11,RDP,VNC,FTP,MOSH ..... ...
- JS数组的基本操作方法
一.concat()concat() 方法用于连接两个或多个数组.该方法不会改变现有的数组,仅会返回被连接数组的一个副本. var arr1 = [1,2,3];var arr2 = [4,5];va ...
- C# 多线程传递参数或多个参数
using System;using System.IO;using System.Text;using System.Threading; namespace ConsoleApp7{ class ...
- SVN添加用户
1. 找到svn安装路径 /svn/repositories/ (如果不知道,可以搜索 :find / -name svn或者是ps -ef | grep svn) 2.进入该目录的conf,其中包 ...