tableList為<table>標(biāo)簽的Id
var resData1 = "";
var res = new Object();
var n = 1;
$('#tableList tbody tr').each(function(i){ // 遍歷 tr
var a = $(this).children();//獲取每一行
var arr =a[1].innerText;//取得第三列的值（可改變數(shù)據(jù)下標(biāo)獲取你所需列的值）
res[arr] = n;
n++;
});
resDataFirst = JSON.stringify(res);
//定義fixHelper使得在拖動(dòng)單元格時(shí)不改變單元格的寬度
var fixHelper = function(e, ui) {
ui.children().each(function() {
$(this).width($(this).width()); //在拖動(dòng)時(shí)浮庐，拖動(dòng)行的cell（單元格）寬度會(huì)發(fā)生改變兔辅。在這里做了處理就沒問題了
});
return ui;
};
//調(diào)用sortable插件懂昂，使得單元格可以拖動(dòng)
$("#tableList tbody").sortable({
placeholder: "ui-state-highlight",
cursor: "move",
helper: fixHelper, //調(diào)用fixHelper
axis:"y",
start:function(e, ui){
ui.item.css({"background":"#696969"}); //拖動(dòng)時(shí)的行循衰，要用ui.helper
return ui;
},
stop:function(e, ui){
var res = new Object();
var n = 1;
$('#tableList tbody tr').each(function(i){ // 遍歷 tr
var a = $(this).children();//獲取每一行
var arr =a[1].innerText;//取得第三列的值
res[arr] = n;
n++;
});
resData1 = JSON.stringify(res);
ui.item.css({"background":"#fff"});
return ui;
}
});
$( "#tableList" ).disableSelection();
//通過ajax保存排序之后的單元格順序
if (resDataFirst == resData1 || resData1 == ""){
growlAlert.danger('未改變順序工三！');
}else{
//提交表單
var url = '';//你自己的保存接口
$.post(url,{order: resData1},
function (data) {
handleResponse(data);
});
}
