Yii Framework 开发教程(43) Zii组件-Droppable示例



上篇介绍如果使用UI组件支持拖放，CJuiDroppable表示某个区域可以接受拖拉过来的UI组件，它封装了 JUI Droppable插件。

我们修改上例，添加一个Droppable区域，当有UI组件拖放到该区域时，显示“Dropped”。

[php]
view plaincopyprint?

<?php $this->beginWidget('zii.widgets.jui.CJuiDroppable', array(
'options'=>array(
'drop'=>'js:function(event,ui){$(this).html("Dropped!")}',
),
'htmlOptions'=>array(
'style'=>'width: 300px; height: 300px; padding:
5px; border: 1px solid #e3e3e3; background: #f7f7f7',
),
));
echo 'Drop here';

$this->endWidget();
?>

<?php $this->beginWidget('zii.widgets.jui.CJuiDroppable', array(
	'options'=>array(
				'drop'=>'js:function(event,ui){$(this).html("Dropped!")}',
				),
			'htmlOptions'=>array(
				'style'=>'width: 300px; height: 300px; padding:
				5px; border: 1px solid #e3e3e3; background: #f7f7f7',
				),
			));
echo 'Drop here';

$this->endWidget();
?>

本例下载