资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

PHP+jQuery-ui怎么进行拖动浮动层排序并保存到数据库-创新互联

这篇文章将为大家详细讲解有关PHP+jQuery-ui怎么进行拖动浮动层排序并保存到数据库,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。

创新互联公司专注为客户提供全方位的互联网综合服务,包含不限于网站建设、成都网站设计、淄博网络推广、小程序制作、淄博网络营销、淄博企业策划、淄博品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们大的嘉奖;创新互联公司为所有大学生创业者提供淄博建站搭建服务,24小时服务热线:18980820575,官方网址:www.cdcxhl.com

PHP+jQuery-ui实现的拖动浮动层排序布局并将拖动后的浮动层位置排序结果保存到数据库实例。

PHP+jQuery-ui怎么进行拖动浮动层排序并保存到数据库

首先引入jQuery库和jquery-ui.min.js,接着放置一个拖动时的加载图片,和从数据库读取出来的多个模块拖动层.modules,及#orderlist用于记录模块的排序值。

  

      " />            ">       Module:              

       

      
            
  


页面js:

$(function() { 
    $(".m_title").bind('mouseover', 
    function() { 
        $(this).css("cursor", "move") 
    }); 
 
    var $show = $("#loader"); //进度条 
    var $orderlist = $("#orderlist"); 
    var $list = $("#module_list"); 
 
    $list.sortable({ 
        opacity: 0.6, 
        revert: true, 
        cursor: 'move', 
        handle: '.m_title', 
        update: function() { 
            var new_order = []; 
            $list.children(".modules").each(function() { 
                new_order.push(this.title); 
            }); 
            var newid = new_order.join(','); 
            var oldid = $orderlist.val(); 
            $.ajax({ 
                type: "post", 
                url: "update.php", 
                data: { 
                    id: newid, 
                    order: oldid 
                }, 
                //id:新的排列对应的ID,order:原排列顺序 
                beforeSend: function() { 
                    $show.html(" 正在更新"); 
                }, 
                success: function(msg) { 
                    $show.html(""); 
                } 
            }); 
        } 
    }); 
});


拖动后保存到数据库,ajax.php中的代码:

$order = $_POST['order']; 
$itemid = trim($_POST['id']); 
if (!empty($itemid)) { 
    if ($order != $itemid) { 
        $query = mysql_query("update sortlist set sort='$itemid' where id=1"); 
        if ($query) { 
            echo $itemid; 
        } else { 
            echo "none"; 
        } 
    } 
}

关于PHP+jQuery-ui怎么进行拖动浮动层排序并保存到数据库就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。


网页标题:PHP+jQuery-ui怎么进行拖动浮动层排序并保存到数据库-创新互联
网址分享:http://cdkjz.cn/article/dejhhs.html
返回首页 了解更多建站资讯
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220