bootstrap-table 上移 下移

bootstrap-table 上移 下移

页面代码：

'<a onclick="upMove(event)" href="#." title="Up">','<i>上移</i>','</a>  ','<a onclick="downMove(event)" href="#." title="Down">','<i >下移</i>','</a>  '

注： 我这是用的动态加载，所以就直接在元素里面加了onclick

        function upMove(event){//点击上移
            detailData("up", event);
        };
        function downMove(event){//点击下移
            detailData("down", event);
        }
        function detailData(type, event){
            var $tr = $(event.target).parents("tr");
            var len = $('#process-table').bootstrapTable('getData').length;
            var idx = $tr.index();//行在table中的位置
            var next_idx = 0;
            var array = $('#process-table').bootstrapTable('getData');
            $tr.fadeOut().fadeIn();
            if(type=='up'){
                 if($tr.index() == 0){alert("首行数据不可上移!"); return}
                 next_idx = idx - 1;
                 $tr.prev().before($tr);
            }else if(type == 'down'){
                 if($tr.index() == len - 1){alert("尾行数据不可下移!"); return};
                 next_idx = idx + 1;
                 $tr.next().after($tr);
            }
            //交换元素
            var temp = array[idx];
            array[idx] = array[next_idx];
            array[next_idx] = temp;
            //后台操作修改数据库顺序
        }
      
      

注：绑定元素其实有很多种，可以采用适合自己的方式，我这里是onclick 方式 获取事件然后进行 操作。