dragsort拖动排序
引入文件jQuery、jquery.dragsort-0.5.2.min.js
html文件:
css文件:
ul { margin:0px; padding:0px; margin-left:20px; }
#uMenuSetting { list-style-type:none; margin:0px; }
#uMenuSetting li { float:left; padding:0px;margin-top:5px;}
.placeHolder div { background-color:white !important; border:dashed 1px white !important; }
js代码:
//elem.append(innerhtml);
$("#menus").append(innerhtml);
//拖动插件初始化
$("#uMenuSetting").dragsort({
dragSelector: "div .menu",
dragBetween: true,
dragEnd: saveOrder,
placeHolderTemplate: "<li class='placeHolder '><div></div> </li>"
});
//保存排序
function saveOrder() {
//var data = $("#list1 li").map(function () { return $(this).children().html(); }).get();
//var data = $("#uMenuSetting li").map(function () { return $(this).find('.menuKey').val(); }).get();
//for (var i = 0; i < data.length; i++) {
// data[i] = eval("(" + data[i] + ")");
// data[i].Sort = i;
//}
////调用ashx保存方法
//$.post("/MetaPortlet/EPP/PopularFunctions/View/PopularFunctionsHandler.ashx", { type: "order", PopularFunctions: JSON.stringify(data) }, function (data, statu) {
// if (statu == 'success') {
// if (data == 'false') {
// console.log("排序错误");
// } else {
// console.log("排序成功");
// }
// }
//});
};
dragsort拖动排序的更多相关文章
- 基于Metronic的Bootstrap开发框架经验总结(13)--页面链接收藏夹功能的实现2(利用Sortable进行拖动排序)
在上篇随笔<基于Metronic的Bootstrap开发框架经验总结(12)--页面链接收藏夹功能的实现>上,我介绍了链接收藏夹功能的实现,以及对收藏记录的排序处理.该篇随笔主要使用功能按 ...
- 锋利的jQuery-7--query ui效果库--拖动排序插件sortable
一个简单的拖动排序效果,具体请参看jQuery ui官网demo. jquery ui :http://jqueryui.com/ sortable例子:http://jqueryui.com/sor ...
- android可拖动排序GridView实现
经常使用今日头条.网易新闻的同学们应该都会注意到用于管理多个频道的可拖动排序GridView,下面介绍一下可拖动的DragGridView的实现方法.代码放在GitHub上https://github ...
- Element-UI标签页el-tabs组件的拖动排序实现
ElementUI的标签页组件支持动态添加删除,如下图: 但是这个组件不支持标签之间的拖动排序.那么我们自己怎样实现这个功能呢? 有一个叫vuedraggable的组件(https://github. ...
- RecyclerView-- 侧滑删除和拖动排序
实现这么个功能我们不需要再去继承RecyclerView,只需要去了解ItemTouchHelper这个类即可,接下来我们就去看看都有些什么 ItemTouchHelper.Callback 默认需要 ...
- IOS UITableView拖动排序功能
UITbableView作为列表展示信息,除了展示的功能,有时还会用到删除,排序等功能,下面就来讲解一下如何实现排序. 排序是当表格进入编辑状态后,在单元格的右侧会出现一个按钮,点击按钮,就可以拖动单 ...
- 隐藏 FastAdmin 列表中的拖动排序按钮
隐藏 FastAdmin 列表中的拖动排序按钮 就是以下这个按钮,想先删除不要. 刚开始在 CMS 插件中的栏目中发现没有,以为在哪个位置中,但找到半天的 weigh 都没有找到weigh 的字眼. ...
- jquery 鼠标拖动排序Li或Table
1.前端页面 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="拖动排序Li或Ta ...
- sortable结合angularjs实现拖动排序
记录拖动排序 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...
随机推荐
- Git - Eclipse 提交工程至 GitHub
1. 在 GitHub 新建一个工程 hello-world,repository 地址是 https://github.com/username/hello-world.git 2. 在 Eclip ...
- HDOJ2029Palindromes _easy version
Palindromes _easy version Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Jav ...
- JDBC之数据库操作
JDBC重要界面有: java.sgl.DriverManager:完成驱动程序的装载和建立新的数据库连接. java.sgl.Connection:表示对某一指定数据库的连接. java.sgl.S ...
- 229. Majority Element II My Submissions Question
Total Accepted: 23103 Total Submissions: 91679 Difficulty: Medium Given an integer array of size n, ...
- windows搭建virtualbox虚拟机安装的android环境
1.首先安装virtualbox,从官网下载,安装完成之后在本地连接里面有virtualbox虚拟的网卡,可能会影响网络连接,一般禁用 2.下载android的镜像,完整名称是:android-x86 ...
- wampserver安装后 mysql 所有数据库丢失的解决方案
事情起源: 晚上十点客户紧急来电,说是网站全部瘫痪.同事登陆数据库一看,Mysql Workbench Database下一片空白.当时我们都傻了. 发现原因: 服务器环境是windows serve ...
- javascript笔记——闭包
花了三天时间,终于弄清楚闭包的各种写法和注意的事项,以及以前写,经常出错的地方,特此做一个总结,虽然不够专业,但是对于那些初学者来说,绝对对闭包的理解事半功倍. 案例一: function aa(){ ...
- Poj 2583 Series Determination
1.Link: http://poj.org/problem?id=2583 2.Content: Series Determination Time Limit: 1000MS Memory L ...
- 韩顺平细说Servlet视频系列意外收获之用命令行编译带有包的java类解决方案
命令行编译带有包的java类 在命令行编译这一块,基本上都是新手入门时了解一下,然后就直奔IDE而去.这样固然没错,就怕那些--.然后今天在视频中看到了这种方法,觉得可能会用到,所以就记录下来了,以备 ...
- poj 1659 Frogs' Neighborhood Havel-Hakimi定理 可简单图定理
作者:jostree 转载请注明出处 http://www.cnblogs.com/jostree/p/4098136.html 给定一个非负整数序列$D=\{d_1,d_2,...d_n\}$,若存 ...