Quenstion:
项目中某功能界面使用easyui的datagrid,grid有多个可编辑的元素:combogrid,textbox,numberbox等等(要多个,测试的时候发现一两个可编辑元素好像不会触发)
前期能够正常使用,后面客户提出需求希望datagrid的行能够拖拽排序操作。
datagrid行实现拖拽
1.使用easyui的扩展 ,引入js文件
<script type="text/javascript" src="datagrid-dnd.js"></script>
2.开启拖拽
$('#dg').datagrid('enableDnd', 1); // enable dragging on second row,第二个参数为索引 $('#dg').datagrid('enableDnd'); // enable dragging all rows
一段时间后发现,以下两个问题
1.combogrid下拉选中值后,没有填充到单元格,第二次选中后才会填充
2.combogrid选中值填充单元格后,光标不点击其他地方的条件下再次点击单元格发现不能编辑;
Answer:
可能是由于这个扩展和所写的方法产生了冲突
手动添加switchbutton,需要拖拽的时候开启,填写数据的时候停用拖拽
<input class="easyui-switchbutton" data-options="100,onText:'启用行拖拽',offText:'停用行拖拽'" id="isDrag" />
$("#isDragRow").switchbutton({ onChange: function (checked) { if (checked) { $("#DialogCheckDetail").datagrid('enableDnd').datagrid({ onBeforeDrag: function (row) { return true;
} }) } else { $("#DialogCheckDetail").datagrid({
onBeforeDrag: function (row){ return false; //拖拽开始前触发,返回 false 则取消拖拽。 } }) } } })
//返回false不触发拖拽