99re热视频这里只精品,久久久天堂国产精品女人,国产av一区二区三区,久久久精品成人免费看片,99久久精品免费看国产一区二区三区

jQuery EasyUI 擴(kuò)展 – 數(shù)據(jù)網(wǎng)格行拖放

2018-09-07 15:49 更新

jQuery EasyUI 擴(kuò)展 - 數(shù)據(jù)網(wǎng)格行拖放（Drag and Drop Rows in DataGrid）

jQuery EasyUI 擴(kuò)展 jQuery EasyUI 擴(kuò)展

用法

包含 'datagrid-dnd.js' 文件

<script type="text/javascript" src="datagrid-dnd.js"></script>

啟用拖拽與放置

	<table class="easyui-datagrid" title="DataGrid" style="width:700px;height:250px" data-options=" 				singleSelect:true, 				data:data, 				onLoadSuccess:function(){ 					$(this).datagrid('enableDnd'); 				} 			">
		<thead>
			<tr>
				<th data-options="field:'itemid',width:80">Item ID</th>
				<th data-options="field:'productid',width:100">Product</th>
				<th data-options="field:'listprice',width:80,align:'right'">List Price</th>
				<th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
				<th data-options="field:'attr1',width:250">Attribute</th>
				<th data-options="field:'status',width:60,align:'center'">Status</th>
			</tr>
		</thead>
	</table>

事件

該事件擴(kuò)展自數(shù)據(jù)網(wǎng)格（datagrid），下面是為數(shù)據(jù)網(wǎng)格（datagrid）添加的事件。

名稱(chēng) 參數(shù) 描述
onBeforeDrag row 當(dāng)一行的拖拽開(kāi)始前觸發(fā)，返回 false 則取消拖拽。
onStartDrag row 當(dāng)開(kāi)始拖拽一行時(shí)觸發(fā)。
onStopDrag row 當(dāng)停止拖拽一行后觸發(fā)。
onDragEnter targetRow, sourceRow 當(dāng)拖拽一行進(jìn)入某允許放置的目標(biāo)行時(shí)觸發(fā)，返回 false 則取消放置。
onDragOver targetRow, sourceRow 當(dāng)拖拽一行在某允許放置的目標(biāo)行上時(shí)觸發(fā)，返回 false 則取消放置。
onDragLeave targetRow, sourceRow 當(dāng)拖拽一行離開(kāi)某允許放置的目標(biāo)行時(shí)觸發(fā)。
onBeforeDrop targetRow,sourceRow,point 當(dāng)一行被放置前觸發(fā)，返回 false 則取消放置。
targetRow：放置的目標(biāo)行。
sourceRow：拖拽的源行。
point：指示放置的位置，可能的值：'top' 或 'bottom'。
onDrop targetRow,sourceRow,point 當(dāng)一行被放置時(shí)觸發(fā)。
targetRow：放置的目標(biāo)行。
sourceRow：拖拽的源行。
point：指示放置的位置，可能的值：'top' 或 'bottom'。

方法

該方法擴(kuò)展自數(shù)據(jù)網(wǎng)格（datagrid）。

名稱(chēng) 參數(shù) 描述
enableDnd index 啟用行的拖拽與放置。
'index' 參數(shù)指示要被拖拽與放置的行。
如果該參數(shù)未指定，則拖拽與放置所有行。

代碼實(shí)例：

$('#dg').datagrid('enableDnd', 1);	// enable dragging on second row
$('#dg').datagrid('enableDnd');	// enable dragging all rows

下載 jQuery EasyUI 實(shí)例

jquery-easyui-datagrid-dnd.zip

jQuery EasyUI 擴(kuò)展 jQuery EasyUI 擴(kuò)展
以上內(nèi)容是否對(duì)您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)