我有一个jqgrid,其中在创建网格时设置了sortableRows()。拖放工作正常,直到我去选择用数据填充表单的行。我编辑表单数据,然后拖放将不再起作用。下面是网格的配置。
var ug = u.grid;
u.readFromStorage('problemId');
if (g.problemId !== '') {
ug.selectFirstRecord = false;
}
ug.gridId = concerns.problemGridId;
ug.colNames = ['ID', 'Category', 'Concern', 'Priority', 'Date From', 'Date To', 'Period', 'Reporting Type', 'Modified On', 'Modified By', '','','',''];
ug.colModel = [ { name: 'ProblemId', index: 'Problem_ID', width: 1, hidden: true },
{ name: 'Category', width: 120, sortable: false,
formatter: function (cellvalue, options, rowObject) {
return '<span class="ui-icon ' + btnIcon.DRAGNDROP + '" title="Row is drag / drop" style="display: inline - block;"></span>' + cellvalue;
}, classes: 'dragRow'
},
{ name: 'Name', width: 230,
cellattr: function (rowId, val, rawObject, cm, rdat) {
return 'title="' + rdat.WholeName +'"';
}, sortable: false, classes: 'dragRow'
},
{ name: 'Priority', width: 40, classes: 'dragRow' },
{ name: 'DateFrom', width: 100, sortable: false, classes: 'dragRow' },
{ name: 'DateTo', width: 100, sortable: false, classes: 'dragRow' },
{ name: 'Period', width: 140, sortable: false, classes: 'dragRow' },
{ name: 'ReportingType', index: 'ReportingType', width: 100, sortable: false, classes: 'dragRow' },
{ name: 'TouchDate', index: 'Touch_Date', width: 100, sortable: false, classes: 'dragRow' },
{ name: 'TouchUser', index: 'TouchUser', width: 100, sortable: false, classes: 'dragRow' },
{ name: 'SequenceOrder', index: 'SequenceOrder', width: 1, hidden: true},
{ name: 'WholeName', index: 'WholeName', width: 1, hidden: true },
{ name: 'OtherConernFlag', index: 'OtherConernFlag', width: 1, hidden: true },
{ name: 'PriorityOrder', index: 'PriorityOrder', width: 1, hidden: true }
];
ug.sortname = 'PriorityOrder';
ug.pager = $('#pageNavigation-problemsGrid');
ug.onSelectRow = function (rowid) {
concerns.selectedProblemId = rowid;
return concerns.selectProblem(rowid);
};
ug.onGetData = function (pdata) {
u.grid.gdata[u.grid.gridId] = pdata;
return concerns.getProblemData(pdata);
};
ug.onFormat = function (jdata, pageIndex, pageSize) {
return concerns.formatProblemGrid(jdata, pageIndex, pageSize);
};
ug.afterSuccess = function () {
if (g.problemId !== '') {
g.Mode = '';
$(concerns.problemGridId).setSelection(g.problemId);
u.saveToStorage('problemId', '');
}
};
ug.build();
$(ug.gridId).sortableRows({
//ug.sortableRows({
start: function (e, ui) {
concerns.oldRowIndex = ui.item.index();
concerns.oldRowIndex--;
var rows = $(ug.gridId).jqGrid('getDataIDs');
var rowData = $(ug.gridId).jqGrid('getRowData', rows[concerns.oldRowIndex]);
concerns.oldSeqOrder = rowData["SequenceOrder"];
concerns.oldPriority = rowData["Priority"];
},
update: function (i, ui) {
var _newIndex = ui.item[0].rowIndex;
var rows = $(ug.gridId).jqGrid('getDataIDs');
var _ids = [];
_newIndex = _newIndex - 1;
//Moving down
if (concerns.oldRowIndex < _newIndex) {
for (i = _newIndex - 1; i >= concerns.oldRowIndex; i--) {
var _rowData = $(ug.gridId).jqGrid('getRowData', rows[i]);
var _rData = $(ug.gridId).jqGrid('getRowData', rows[i + 1]);
_ids.push({
m_Item1: _rData["ProblemId"],
m_Item2: _rowData["SequenceOrder"],
m_Item3: _rowData["Priority"]
});
}
var _rwData = $(ug.gridId).jqGrid('getRowData', rows[concerns.oldRowIndex]);
_ids.push({
m_Item1: _rwData["ProblemId"],
m_Item2: concerns.oldSeqOrder,
m_Item3: concerns.oldPriority
});
}
//Moving up
if (concerns.oldRowIndex > _newIndex) {
for (i = _newIndex; i <= concerns.oldRowIndex - 1; i++) {
var _rowData = $(ug.gridId).jqGrid('getRowData', rows[i]);
var _rData = $(ug.gridId).jqGrid('getRowData', rows[i + 1]);
_ids.push({
m_Item1: _rowData["ProblemId"],
m_Item2: _rData["SequenceOrder"],
m_Item3: _rData["Priority"]
});
}
var _rwData = $(ug.gridId).jqGrid('getRowData', rows[concerns.oldRowIndex]);
_ids.push({
m_Item1: _rwData["ProblemId"],
m_Item2: concerns.oldSeqOrder,
m_Item3: concerns.oldPriority
});
}
app.ajax({
values: { items: _ids },
url: 'Services/Patient.svc/UpdateProblemSequenceOrder'
}).done(function (data, status, jqXhr) {
$(concerns.problemGridId).trigger('reloadGrid');
});
}
});
我尝试使用下面的方法重新启用网格,但是它不起作用。
在用户完成编辑后重新启用SortableRows的一种好方法是什么?
$.fn.extend({
preventDisableSelection: function () {
return this.each(function (i) {
$(this).bind('mousedown.ui-disableSelection selectstart.ui-disableSelection', function (e) {
e.stopImmediatePropagation();
});
});
}
});