旗下导航:搜·么
当前位置:网站首页 > PHP教程 > 正文

TP5完成表格拖动排序并保存到数据库的要领(附代码)【php教程】

作者:搜搜PHP网发布时间:2019-11-26分类:PHP教程浏览:89


导读:本篇文章给人人带来的内容是关于TP5完成表格拖动排序并保存到数据库的要领(附代码),有肯定的参考价值,有须要的朋侪能够参考一下,愿望对你有所协助。前一段时间修正了一个旧的项...
本篇文章给人人带来的内容是关于TP5完成表格拖动排序并保存到数据库的要领(附代码),有肯定的参考价值,有须要的朋侪能够参考一下,愿望对你有所协助。

前一段时间修正了一个旧的项目,客户请求我给表格从新排序,按大夫的职称排序。由于客户的这个项目是病院的人事体系,考虑到悉数病院有几千号人,如果一个个按客户的请求排得累坏我的小腰...幸亏这时候我想起了能够应用jqueryUi插件完成这个功用。然则jqueryUi插件只能在当前页面上排序,页面一革新又恢复原样了。因而我就研讨怎样拖动排序并永远把排序保存到数据库中,做了1小时,做出来了。这里纪录一下,如果有同砚有更好的思绪,请不吝赐教..
起首下载jqueryUi插件,网上一搜就要,这里略过。
下载完成后,引入页面。到场一行代码就能够:

<script type="text/javascript" src="jquery-ui.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
    $("#sort tbody").sortable();
});
</script>

须要注重的是,选择器应当选中表格的tbody. sort要领中能够增加许多设置的参数,细致的能够检察这款插件的文档。一样网上一搜一大堆,比方菜鸟教程就有。如今只是完成了在当前页面排序,但数据库照样老样子。下面是我的把排序保存到数据库的要领。之前我的排序是根据数据表的ID值,默许倒序的,如今我能够给数据表中加一个sort字段,或许XX字段,代表排序的数字。 在每次拖动完成后,应用这款插件内置的update函数,经由过程ajax体式格局把排序完成的每一个行的ID传到背景。在背景控制器里吸收后,遍历,把排在第一行的数据的sort值改成键值+1.
比方排序完成后第一行的数据ID值为8,第二行的数据ID为6,第三行动2,背景吸收遍用时,ID为8的数据肯定是第一个遍历的,那该数据在foreach内里的键值肯定是0,即$k为0,那把它的排序改成$k+1即为0+1即是1.同理,第二个数据的sort就为$k+1即为2,以此类推.然后按sort值正序分列即可.
下面是前台代码:

$("#sort tbody").sortable({
        update:function () {
            var idArr = [];
            $("input[name='id']").each(function () {//遍历每一行的ID值
                idArr.push($(this).val());//把拍完序的数据ID顺次推入数组
            })
            $.ajax({
                type: "POST",
                dataType: "json",
                url: "__URL__/staff/pinyong",
                data:{idArr:idArr},
                success:function (data) {
                    layer.msg(data['msg'],{icon:1,time:2000});
                },
                error:function (request) {
                    console.log(request);
                }
            });
        }
    });

这个是一个老项目,TP3写的,所以我没用TP5的写法,TP5只须要把url地点改成{:url(...)}的写法就行.

背景代码:(也是TP3的写法,TP5只要用model要领取表模子,然后再改改save要领就能够)

  public function pinyong(){
   if (IS_POST) {
        //前台post体式格局传数组的话,背景必需指定吸收花样才吸收,不然会报错
        $arr = I('idArr/a');
        foreach ($arr as $k => $v) {
            M('pinyong')->where('id','eq',$v)->save(['sort'=>$k + 1]);
        }
        $this->success('排序胜利');
    } else {
        $this->display();
    }
}

如许,每次前台拖动排序都邑触发update函数,然后就会把新排序的ID值用ajax传到背景,背景吸收后,按递次从新修正sort值就能够.

本篇文章到这里就已悉数完毕了,更多其他精彩内容能够关注ki4网的JavaScript教程视频栏目!

以上就是TP5完成表格拖动排序并保存到数据库的要领(附代码)的细致内容,更多请关注ki4网别的相干文章!

标签:phpjavascriptcsshtml