弹出框中的AJAX分页

时间:2021-08-02 03:30:08
$(function() {

    $("body").on("click",".set-topic",function(){
/*获取所有题目接口*/
var subjectType =$(this).attr("data-type");
var tid = $(this).attr("data-id");
var url = '/questions?subjectType='+subjectType;
var params = {
"tid":tid
};
$.ajax({
url: url,
type: 'GET',
data:params,
success: function(data) {
$("body").find(".topicList").html(data);
var allIds = $("body").find("input[name=Tids]").attr("value");
var arrryId=allIds.split(",");/*split() 方法用于把一个字符串分割成字符串数组。*/
$("body").find(".topicList").find(".layui-unselect").click(function(){
var $this = $(this);
var pId = $this.parents("tr").attr("data-id");
getInputIds($this,arrryId,pId);
})
bindEvent();
}
});
function getInputIds($this,arrryId,pId){
if($this.hasClass("layui-form-checked")){
$this.removeClass("layui-form-checked");
arrryId.removeByValue(pId);
$("body").find("input[name=Tids]").attr("value",arrryId);
}else{
$this.addClass("layui-form-checked");
arrryId.push(pId);
var stringIds = arrryId.join(",")
$("body").find("input[name=Tids]").attr("value",stringIds);
}
}
/**根据值删除数组元素**/
Array.prototype.removeByValue = function(val) {
for(var i=0; i<this.length; i++) {
if(this[i] == val) {
this.splice(i, 1);
break;
}
}
} function bindEvent(){
        /**弹出框中的翻页**/
$('.pagination').find('a').click(function(){
var allIds = $("body").find("input[name=Tids]").attr("value");
var arrryId=allIds.split(",") $.get(this.href, function(data){
$("body").find(".topicList").html(data);
$("body").find("input[name=Tids]").attr("value",arrryId);
/*回显*/
$("body").find(".topicList").find(".layui-unselect").each(function(){
var $this = $(this);
var pId = $this.parents("tr").attr("data-id");
if(allIds.indexOf(pId)>=0){
$this.addClass("layui-form-checked");
}else{
$this.removeClass("layui-form-checked");
}
})
$("body").find(".topicList").find(".layui-unselect").click(function(){
var $this = $(this);
var pId = $this.parents("tr").attr("data-id");
getInputIds($this,arrryId,pId);
})
bindEvent();
})
return false;
});
} /* 提交选中题目*/
$("#Modal").find(".btn-primary").unbind("click").click(function(){
var url = '/topic/'+tid+'/set_questions';
var qids=$("body").find("input[name=Tids]").attr("value");
if (qids.substr(0,1)==','){
s=qids.substr(1);
}
if(qids==""){ }
var params = {
tid:tid,
qids:qids
}
$.ajax({
url:url,
method:'post',
data:params,
success:function(data){
location.reload();
}
}) }) }) $("#topics-ip").click(function(){
/*获取所有专题接口*/
var theadTr = '<tr><td>序号</td><td>专题</td><td>费用</td></tr>';
$("#a-thead").html(theadTr);
var url = '/topics/json';
getTopics(url);
});
$("#topics-ip").click(function(){
/*获取所有专题接口*/
var theadTr = '<tr><td>序号</td><td>专题</td><td>费用</td></tr>';
$("#a-thead").html(theadTr);
var url = '/topics/json';
getTopics(url);
/*检索专题*/
$("body").find(".seach-p-btn").unbind("click").click(function(){
var key = $(this).siblings(".layui-input").val();
var url='/topics?key='+key;
getTopics(url);
});
/*输入框实时搜索*/
$("body").on("input",".layui-input",function(){
var key = $(this).val();
var url='/topics?key='+key;
getTopics(url);
}); }); $("#practicer-ip").click(function(){
/*获取所有练习者接口*/
var theadTr = '<tr><td>序号</td><td>姓名</td><td>邮箱</td></tr>';
$("#a-thead").html(theadTr);
var url = '/users';
getUser(url);
/*检索练习者*/
$("body").find(".seach-p-btn").unbind("click").click(function(){
var key = $(this).siblings(".layui-input").val();
var url='/users?key='+key;
getUser(url);
});
/*输入框实时搜索*/
$("body").on("input",".layui-input",function(){
var key = $(this).val();
var url='/users?key='+key;
getUser(url);
}); });
function getUser(url){
$.ajax({
url: url,
type: 'GET',
success: function(data) {
if(data.code==200){
console.log(data)
var n = data.users.length;
if(n>0){
$("#a-list").html("");
for(var i=0;i<n;i++){
var index = i+1
var tr = '<tr data-id="'
+data.users[i].id
+'" data-name="'
+data.users[i].name
+'"><td>'
+index
+'</td><td>'
+data.users[i].name
+'</td><td>'
+data.users[i].email
+'</td></tr>';
$("#a-list").append(tr); }
}else{
var tr = '<tr><td colspan="3">暂无信息</td></tr>';
$("#a-list").html(tr);
}
/* 选中专题*/
$("#a-list").find("tr").click(function(){
$(this).toggleClass("tr-checked")
$(this).siblings().removeClass("tr-checked");
})
}else{
layer.msg("获取专题失败,请刷新后重试!")
}
}
})
/* 提交选中练习者*/
$("#Modal").find(".btn-primary").unbind("click").click(function(){
var title = $("#a-list").find(".tr-checked").attr("data-name");
var id = $("#a-list").find(".tr-checked").attr("data-id");
$("#practicer-ip").val(title);
$("input[name=toAuthorizerId]").val(id)
$("#Modal").modal("hide");
})
} function getTopics(url){
$.ajax({
url: url,
type: 'GET',
success: function(data) {
if(data.code==200){
var m = data.topics;
console.log(data)
console.log(m)
console.log(333)
var n = data.topics.length;
var m = data.topics;
console.log(m)
if(n>0){
$("#a-list").html("");
for(var i=0;i<n;i++){
var index = i+1
var tr = '<tr data-id="'
+data.topics[i].id
+'" data-title="'
+data.topics[i].title
+'"><td>'
+index
+'</td><td>'
+data.topics[i].title
+'</td><td>'
+data.topics[i].fee
+'</td></tr>';
$("#a-list").append(tr); }
}else{
var tr = '<tr><td colspan="3">暂无信息</td></tr>';
$("#a-list").html(tr);
}
/* 选中专题*/
$("#a-list").find("tr").click(function(){
$(this).toggleClass("tr-checked")
$(this).siblings().removeClass("tr-checked");
})
}else{
layer.msg("获取专题失败,请刷新后重试!")
}
}
})
/* 提交选中专题*/
$("#Modal").find(".btn-primary").unbind("click").click(function(){
var title = $("#a-list").find(".tr-checked").attr("data-title");
var id = $("#a-list").find(".tr-checked").attr("data-id");
$("#topics-ip").val(title);
$("input[name=topicId]").val(id)
$("#Modal").modal("hide");
})
}
})

弹出框中的AJAX分页的更多相关文章

  1. 苹果手机iOS11中fixed弹出框中input光标错位问题

    最近遇到了一个移动前端的BUG:手机弹出框中的输入框focus时光标可能会错位. 刚开始时我完全不知道错误原因是什么,在电脑上调试时完全没有问题,手机上出现问题时也没有找到规律.后来在网上搜索了大量的 ...

  2. 在IOS11中position&colon;fixed弹出框中的input出现光标错位的问题

    问题出现的背景: 在IOS11中position:fixed弹出框中的input出现光标错位的问题 解决方案 一.设计交互方面最好不要让弹窗中出现input输入框: 二.前端处理此兼容性的方案思路: ...

  3. 弹出框中选项卡的运用(easyUI)

    先看一下页面效果: 此处有两个知识点:一个是弹出框的运用,一个是选项卡的运用 分析一下该HTML代码,最外面一个div是弹出框的,默认是关闭状态,可通过ID来控制弹出框的开关,该div的样式是easy ...

  4. 使用easeui dialog弹出框中使用CKeditor多次加载后无法编辑问题

    问题呈现:弹出框页面 <tr class="addtr"> <th>内容</th> <td> <!-- <textare ...

  5. mvc 在弹出框中实现文件下载

    var myParent = parent.parent.parent.parent.parent.parent.parent.parent.parent.parent.parent.parent; ...

  6. vue在element-ui的dialog弹出框中加入百度地图

    参考:https://blog.csdn.net/u012724595/article/details/82703579 <!-- gps弹窗 --> <el-dialog v-di ...

  7. firefox浏览器中 bootstrap 静态弹出框中select下拉框不能弹出(解决方案)

    问题出现场景1: 在firefox浏览器中在bootstrap弹出的modal静态框中再次弹出一个静态框时 select下拉框不能弹出选项 解决方案:去掉最外层静态框的 tabindex=" ...

  8. layer弹出框中icon数字参数说明

    前言icon参数为0,如下代码: layer.msg(}); 运行结果如图: icon参数为1,如下图 icon参数为2,如下图: icon参数为3,如下图: icon参数为4,如下图: icon参数 ...

  9. IOS中position&colon;fixed弹出框中的input出现光标错位的问题

    解决方案是 在弹框出现的时候给body添加fixed <style type="text/css"> body{ position: fixed; width: 100 ...

随机推荐

  1. UINavigationController导航控制器

    UINavigationController导航控制器,是多个界面间跳转的重要元素,可以理解为它存储着多个viewController,它的存储结构是栈,栈的特点是先进后出,所以添加视图控制器时,要特 ...

  2. IOS开发 应用程序图标数字角标

    其实实现这个功能很简单,只要调用UIApplication即可.   用法用例:[UIApplication sharedApplication].applicationIconBadgeNumber ...

  3. &lbrack;转&rsqb;IOS上路&lowbar;01-Win7&plus;VMWare9&plus;MacOSX10&period;8&plus;XCode4&period;6&period;3

    本文转自:http://my.oschina.net/vigiles/blog/141689 目录[-] 1. 资源准备: 1)实体机: 2)VMWare9: 3)VM for MacOS 补丁: 4 ...

  4. C&num;中子类调用父类的实现方法

    这篇文章主要介绍了C#中子类调用父类的实现方法,通过实例逐步分析了类中初始化构造函数的执行顺序问题,有助于加深对C#面向对象程序设计的理解,需要的朋友可以参考下     本文实例讲述了C#中实现子类调 ...

  5. HW--漂亮度2(测试通过)

    总结:几个函数的使用 (1)  int num=Integer.parseInt(str[0]); //将第一个字符串转成整形数,表示名字个数 (2) String string1=str[i].to ...

  6. 小黑小波比&period;coding的使用

    1_Coding的演示 1_html的演示 1_先查看帮助 1.它支持的语言非常多.下面是链接地址 https://coding.net/u/bobo159357456/p/html/paas/hel ...

  7. How To&colon; Use CLR Profiler

    (翻译)How To: Use CLR Profiler   第一次翻译对我而言比较长的E文,有很多不足之处,请见谅.(个人的习惯GC又做了名词又做了名词) 原文:http://msdn.micros ...

  8. SQL查询--选择运算&lpar;1&rpar;

    /**  本贴使用MySQL数据库  **/ WHERE子句可以实现关系代数中的选择运算,用于查询满足选择条件的元组,常用的查询条件有: 1.比较运算:>,>=,<,<=,=, ...

  9. Python源代码剖析笔记3-Python运行原理初探

    Python源代码剖析笔记3-Python执行原理初探 本文简书地址:http://www.jianshu.com/p/03af86845c95 之前写了几篇源代码剖析笔记,然而慢慢觉得没有从一个宏观 ...

  10. servlet入门学习之API

    java servlet API学习网址: http://tomcat.apache.org/tomcat-7.0-doc/servletapi/ http://tomcat.apache.org/t ...