最新赞助活动温馨提示:自愿赞助服务器费用,学生和没有工作的整站资源免费下载!
头像

jQuery+Ajax打开弹出分页层并保存多选框选中数据

来源:http://www.erdangjiade.com/ 沐浴春风 2015-11-18 05:48浏览(2170)

这是后台经常用到的ajax分页效果,首先打开订单列表弹出层,然后选择多选款,点击分页也可保留刚才选中的数据,最后点击保存按钮,以Ajax形式提交到数据库中去。提示:弹出层用的bootstrap的nodal方法,已经封装在jquery.js中。

0、请不要问“在不在”之类的问题,有问题直接问!1、学生或暂时没有工作的童鞋,整站资源免费下载!2、¥9.9充值终身VIP会员,加我微信,826096331 拉你进VIP群学习!3、程序员加油,技术改变世界。在线 充值

jQuery+Ajax打开弹出分页层并保存多选框选中数据
分类:悬浮层/弹出层 > 弹窗 难易:中级
查看演示

加我微信,拉你进VIP群学习:

下载资源 下载积分: 260 积分

绑定单选按钮、全选按钮和切换分页数据

$("#windown_box").delegate(".checkbox_one", "click", function() { //绑定单选按钮
    isCheckAll();
    getOrderIdsChose();
}).delegate(".checkbox_all", "click", function() { //绑定全选按钮
    var checked = $(this).attr("checked");
    if (checked == "checked") {
        $(".checkbox_one").attr("checked", "checked");
    } else {
        $(".checkbox_one").removeAttr("checked");
    }
    getOrderIdsChose();
}).delegate(".page a", "click", function() { //绑定分页切换对应的数据
    var page = parseInt($(this).attr("data-page"));
    getPage(page);
})

Ajax传参分页

function getPage(page) {
    $("#orders").html("<div class='loading'><img src='images/loading.gif' alt='loading'></div>")
    var page = page > 0 ? page : 1;
    $.post("ajax.php", {p: page}, function(data) {
        $("#orders").html(data);
        var order_ids = $("#order_ids").val();
        if (order_ids) {
            var order_ids_arr = order_ids.split(",");
            for (var i = 0; i < order_ids_arr.length; i++) {
                $("input.checkbox_one[value=" + order_ids_arr[i] + "]").attr("checked", "checked")
            }
        }
        isCheckAll();
    })
}
声明:本文为原创文章,如需转载,请注明来源erdangjiade.com并保留原文链接:https://www.erdangjiade.com/js/567.html
评论3
头像

友情提示:垃圾评论一律封号 加我微信:826096331拉你进VIP群学习群

  • 头像 板凳
    07-10 09:07
    tian0922
    这个效果不错 ,挺好的 可以学习一下
  • 头像 椅子
    10-10 13:18
    czaiq
    这个效果好,真厉害
  • 头像 沙发
    09-23 09:48
    小张111
    非常不错,帮帮的
1 2