今天遇到这个业务,记录下来,参考至
https://bbs.csdn.net/topics/390641047
1.移动行操作(相对于2只是静态移动)
function move(isUp) {
var dt=$('#mainTable');
var selections = dt.datagrid("getSelections");
if(selections.length == 0){
return;
var length = dt.datagrid("getRows").length;
for(var i = 0; i < selections.length; i++){
var index ,$i,newIndex;
if(isUp){
$i = i;
index = dt.datagrid('getRowIndex',selections[$i]);
if(index <= 0)return;
newIndex = index - 1;
}else{
var $i = selections.length-1-i;
index = dt.datagrid('getRowIndex',selections[$i]);
if(index >= length-1)return;
newIndex = index + 1;
dt.datagrid("deleteRow",index);
dt.datagrid("insertRow",{index : newIndex,row:selections[$i]});
dt.datagrid("selectRow",newIndex);
2.移动行并且更新列序号,这里更新orderNo排序号(相对于1可以用 getChanges获取到移动过的行,包括序号修改过的行,可以直接保存到后台)
function move1(isUp) {
var dt=$('#mainTable');
var selections = dt.datagrid("getSelections");
if(selections.length == 0){
return;
var datas = dt.datagrid("getRows");
var length = dt.datagrid("getRows").length;
//缓存选中行
var rowIndexs=[];
//更新序号,删除行,插入行
for(var i = 0; i < selections.length; i++){
var index,$i,newIndex;
if(isUp){
$i = i;
index = dt.datagrid('getRowIndex',selections[$i]);
if(index <= 0)return;
newIndex = index - 1;
//修改序号
selections[$i].orderNo = parseInt(selections[$i].orderNo) - 1;
dt.datagrid('updateRow',{ index: newIndex,row: {orderNo : parseInt(datas[newIndex].orderNo) + 1 } });
}else{
var $i = selections.length-1-i;
index = dt.datagrid('getRowIndex',selections[$i]);
if(index >= length-1)return;
newIndex = index + 1;
//修改序号
selections[$i].orderNo = parseInt(selections[$i].orderNo) + 1;
dt.datagrid('updateRow',{ index: newIndex,row: {orderNo : parseInt(datas[newIndex].orderNo) - 1 } });
dt.datagrid("deleteRow",index);
//插入行
dt.datagrid("insertRow",{index : newIndex,row:selections[$i]});
//缓存选中行
rowIndexs.push(newIndex);
//重新选择行
for(var i=0; i<rowIndexs.length; i++){
dt.datagrid("selectRow",rowIndexs[i]);
function save(){
//保存数据
var rows = $('#mainTable').datagrid('getChanges');
// $.ajax
如果需要设置默认排序状态,可以使用datagrid的sortName、sortOrder属性设置默认,如果多个列之间有依赖顺序关系,可以开启multiSort,如果多个列之间没有关系,且独立,不想更改都判断多个属性的状态,建议使用columns属性的sortable、order。...
实现代码-code
<script type="text/javascript">
$.extend($.fn.datagrid.methods, { columnMoving: function(jq) { return jq.each(function() { var target = this; var cells = $(this).datagr...
$(function(){
$('#MHManagementDataGrid').datagrid({
url: "${pageContext.request.contextPath}/qurey_all_member.do",
rownumbers:true,//序列号,显示在第一列
1、easyui中的拖放功能
要实现easyUI的datagrid表格的拖拽,需要使用到easyUI的extension扩展。可拖放的数据表格在easyui手册extension中有详细的介绍,关于如何导入js引用,如何启用数据表格的拖放,都有例子可以借鉴,在此处简单说明一下。
首先js的引用,用到 datagrid-dnd.js 文件,下载地址:http://www.jeasyui.com/
示例如果默认的排序行为不满足您的需求,您可以自定义数据网格(datagrid)的排序行为。 最基础的,用户可以在列上定义一个排序函数,函数名是 sorter。这个函数将接受两个值,返回值将如下:valueA > valueB => 返回 1valueA < valueB => 返回 -1自定义排序代码 $('#tt').datagrid({title:'Custom Sor...
$('#patientLeft').datagrid({
sortName: 'CustomerID', //初始排序字段
sortOrder: 'asc', //初始排序方式:'asc'或'desc'
remoteSort: false, //定义从.
这篇博客是分享给大家使用easyUI 框架从界面向后台传值的两种方法。使用easyui 已经有一段时间,没有很深入的学习过,只是停留在可以简单使用的层面上,这次由于项目需要,前台界面的需求比较多,所以对easyui的使用,在这段时间,从量上,使用的深度上有了一个大的跨越,特别是datagrid 。然后回顾以前使用的一些经验,整理了这篇博客。
先看效果图:我需要将表格中数据如红