一,前端代码:
tdclass=am-text-middleedit_upattr_url={:U('site_order')}attr_id={$item.category_id}
二.通过jq加载html
$(.edit_up).each(function(){
varid=$(this).attr('attr_id');//获取提交的id
varurl=$(this).attr('attr_url');//获取提交地址
varhtml='aclass=am-btnam-btn-smam-btn-defaultam-radiustitle=点击向上移动onclick=edit_order(this,\''+id+'\',\''+url+'\')attr-to=upspan class=am-icon-arrow-up/span/aaclass=am-btnam-btn-smam-btn-defaultam-radiustitle=点击向下移动onclick=edit_order(this,\''+id+'\',\''+url+'\')attr-to=downspan class=am-icon-arrow-down/span/a';
$(this).html(html);
});
前端是样式如图(具体样式自定):
三.Jq提交后台并改变列表的顺序
functionedit_order(obj,t,id,url){
varto=$(obj).attr(attr-to);//获取是向上还是向下
varurl=url+?i=+id+to=+to+ajaxedit=1;//提交地址;
varthat=$(obj)
$.ajax({
url:url,
cache:false,
success:function(val){
val=$.trim(val);
if(val0){//后台返回值
if(to=='down'val0){
varpartentsDiv=that.parents('tr')//获取父级
varnext=partentsDiv.next();//获取父级下一个
if(next.html()!==undefined){
next.fadeOut('slow',function(){
$(this).after(partentsDiv);
}).fadeIn()
}else{//
ayer.msg('到底了')//已经当前页最后一个,这里如果有分页可以通过刷新页面改变数据}
}else{
varparentDiv=that.parents('tr');//获取父级
varprev=parentDiv.prev()//获取父级上一个
if(prev.html()!==undefined){
prev.fadeOut('slow',function(){
$(this).before(parentDiv)
}).fadeIn()
}else{
ayer.msg('到顶了')//已经当前页第一个,这里如果有分页可以通过刷新页面改变数据}
}
}else{
if(to=='down'){
ayer.msg('到底了')//已经是最后一个}else{
ayer.msg('到顶了')//已经是第一个}
}
}
});
}
点击前:
点击后,改变顺序并且有个淡入淡出的效果
四、后台改变数据的排序号,我的思路是保存的时候将id保存为排序号,通过对调二个排序号,来改变排序,
后台代码:
publicfunctionsite_order(){
$id=I('i');
$to=I('to');
$ModelObj=$this-ModelObj;
$old=$ModelObj-field('order_id,parent_id')-where(array('category_id'=$id))-find();
if($to=='down'){
$new=$ModelObj-where(array('status'=1,'parent_id'=$old['parent_id'],'order_id'=array('lt',$old['order_id'])))-order('order_iddesc')-find();
}
if($to=='up'){
$new=$ModelObj-field('order_id,category_id')-where(array('status'=1,'parent_id'=$old['parent_id'],'order_id'=array('gt',$old['order_id'])))-order('order_id')-find();
}
if($new){
$ModelObj-where(array('category_id'=$new['category_id']))-setField('order_id',$old['order_id']);
$res=$ModelObj-where(array('category_id'=$id))-setField('order_id',$new['order_id']);
}
$this-ajaxReturn($res);
}
}
查找出当向上或者向下的时候两条数据的排序号对调一下就行
我的排序是从大到小排,
所有向下的时候,找出小于这个排序号数据中最大的那个,
反之找到找出大于这个排序号数据中最小的那个。