EasyUI Forum
March 28, 2024, 03:17:01 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: How to allow only adjacent moves between two rows in Drag & Drop in Data grid  (Read 5462 times)
chorauoc
Newbie
*
Posts: 23


View Profile Email
« on: January 23, 2017, 11:48:33 PM »

Hello,

I would like to know how can i only allow adjacent drag & drops in data grid(means row 1 to row 2 etc), basically i want to prevent users drag & drop between distant rows (means rows 1 to row 3 etc). Currently i have achieved it by using simple logic but i would like to know whether it can be achieve using setup a property in easyui

here my code
Code:
<?php include './includes/header.php';?>
<?php include './includes/nav.php';?>

<div data-options="region:'center',title:'Cheklist',border:false" style="height:20px;padding:10px;">

<table id="dg" class="easyui-datagrid" title="DataGrid" style="width:auto;height:auto" url="get_users.php" rownumbers="false" data-options="
singleSelect:true,
onLoadSuccess:function(){
$(this).datagrid('enableDnd');


},
onDrop:function(destRow,sourceRow,point){
if((sourceRow.fid-destRow.fid)==1 || (destRow.fid-sourceRow.fid)==1){
                               
                var dId = destRow.id;  // get dropped row id
var sId = sourceRow.id;  // the dragged row id
var destId = destRow.fid;  // get dropped row id
var sourceId = sourceRow.fid;  // the dragged row id
var destVal = destRow.val;  // get dropped row id
var sourceVal = sourceRow.val;  // the dragged row id

$.post('save_user.php',{dId:dId,sId:sId,destId:destId,sourceId:sourceId,destVal:destVal,sourceVal:sourceVal,point:point},function(result){
if (result){

$.messager.show({ // show error message
title: 'Success',
msg: 'done'
});
$('#dg').datagrid('reload');
} else {
$.messager.show({ // show error message
title: 'Error',
msg: 'not done'
});
}
},'json');

                }else{
$.messager.show({ // show error message
title: 'Error',
msg: 'Cannot move like that'
});
$('#dg').datagrid('reload');

}
             }
">
<thead>
<tr>
<th data-options="field:'id',width:80">ID</th>
<th data-options="field:'val',width:100">Value</th>

</tr>
</thead>
</table>


</div>


<?php include './includes/footer.php';?>
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: January 24, 2017, 07:07:20 AM »

There are many events that can be used to custom your drag-drop behavior. Please look at this documentation http://www.jeasyui.com/extension/datagrid_dnd.php
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!