jquery拖拽排序,拖拽排序后端
使用jQuery实现列表排序功能
jquery拖拽排序,针对后台列表table进行拖拽排序(超实用!)
崇信ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为创新互联建站的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:13518219792(备注:SSL证书合作)期待与您的合作!
现在很多后台列表为了方便均使用拖拽排序的功能,对列表进行随意的排序。
话不多说 ,我在网上找了一些demo,经过对比,现在把方便实用的一个demo列出来,基于jqueryUI.js
先上html代码,很简单:
!DOCTYPE htmlhtml lang="en"head
meta charset="UTF-8"
titlejqueryUI拖动/title/headscript src="js/jquery-1.11.0.min.js"/scriptscript src="js/jquery-ui.min.js"/scriptstyle
tr{cursor: pointer;}/stylebodytable id="sort"
thead
tr
th class="index"序号/th
th年份/th
th标题/th
th作者/th
/tr
/thead
tbody
tr
td class="index"1/td
td2014/td
td这是第1个/td
td阿斯蒂芬阿斯蒂芬/td
/tr
tr
td class="index"2/td
td2015/td
td这是第2个/td
td阿萨德发射点发岁的/td
/tr
tr
td class="index"3/td
td2016/td
td这是第3个/td
td阿萨德发送地方/td
/tr
tr
td class="index"4/td
td2017/td
td这是第4个/td
td的说法大赛分/td
/tr
/tbody/table/body/html
除了要引入jquery.js 和jqueryUI.js外,还需要如下一段代码:
$(document).ready(function(){ var fixHelperModified = function(e, tr) { var $originals = tr.children(); var $helper = tr.clone();
$helper.children().each(function(index) {
$(this).width($originals.eq(index).width())
}); return $helper;
},
updateIndex = function(e, ui) {
$('td.index', ui.item.parent()).each(function (i) {
$(this).html(i + 1);
});
};
$("#sort tbody").sortable({
helper: fixHelperModified,
stop: updateIndex
}).disableSelection();
});
这是我发现的比较实用的一个拖动排序,还是比较方便的。
jquery 通过拖动排序
例子没有。关于拖动的jquery插件很多~jquery ui就能实现~
如:
div data-id='1'1/div
div data-id='2'2/div
div data-id='3'3/div
排序后为:
div data-id='2'2/div
div data-id='1'1/div
div data-id='3'3/div
思路就是jquery each()函数获取id,一次写入字符串中(所得为‘2,1,3’),执行ajax请求,将字符串放入数组,key为id,value为序号,所得为:
array(
'2' = '1',
'1' = '2',
'3' = '3'
)
更新数据库即可。
随手打的,不知道对你是否有帮助。
如何用Jquery实现多选后拖拽再排序,列表数据
jquery ui sortable没有这种能力,只能自己多加点代码就进行排序了。。比如,你定义一个数组,把多选的东西都放在数组里,然后进行排序。。不过具体怎么排,就看你的业务需求了。
关于jquery sorttable拖拽排序之后如何保存位置到数据库优化算法
我现在保存的方式是有很大问题的,望高手们能给一个算法优化我的代码
页面上有无限制div行数的数据,比如
name order
a 1
b 2
c 3
d 4
e 5
f 6
1、首先把b拖到a前面,我的做法是当遇到最顶端的数值时把他们的序号1/2=0.5
2、把b拖到c和d之间,做法是把(3+4)/2=3.5
3、把b拖拽到f后面,当遇到最末端的数值时把他们的序号6+1=7
这时候把3种情况name为b的序号值保存进数据库,下次刷新排序之后的结果看起来是没有问题的
但这玩意用久了,也就是说给管理员拖了很多次b的数据之后会不停的上下相加然后相除,虽然序号我定义的是double类型,但已经去到-28E位数,记得到-32E就会超出double的长度。所以我觉得我这样做是绝对只能是用一时的半成品,功能的要求又想实时拖拽,实时保存进数据库,而不想点击按钮来统一保存。
请教朋友们有没有比较好的算法来处理这种问题,有人提出用链表,但我还是理解不得,具体做法
网站名称:jquery拖拽排序,拖拽排序后端
文章分享:http://azwzsj.com/article/dsdsdjh.html