Find us on facebook

Aug 9, 2014

Draggable Droppable in yii

 <style>
 #droppable {
    width: 64em;
    height: 49em;
    padding: 0.5em;
    border: 3px solid #f90;
    border-radius: 1em;
    margin: 0 auto;
}</style>

  <?php
$baseUrl = Yii::app()->baseUrl;
$cs = Yii::app()->getClientScript();
$cs->registerScriptFile($baseUrl.'/css/jquery-ui.js');
?>
 
  <?php
  Yii::app()->clientScript->registerCoreScript('jquery');
$Tables = Table::model()->findAll('is_active = 1');
foreach($Tables as $Table){
?>

  <script>
  $(function() {
left=0;
top=0;
    $("#<?php echo $Table->id?>").draggable();
$( "#droppable" ).droppable({


      drop: function( event, ui ) {
       //alert(ui.draggable.prop('id'));
  event.stopPropagation();
var left = ui.position.left;
var dropPositionY = event.pageY - $(this).offset().top;
var dragItemOffsetY = event.offsetY;
var top =ui.position.top;
//var top = event.offsetY;//
           $.ajax({
   
 url: "<?php echo Yii::app()->createAbsoluteUrl('Table/UpdatePosition');?>",
 type:"POST",
 data: "id="+ui.draggable.prop('id')+"&left=" + left+"&top=" + top,
 //dataType:"json",
 success: function(responce)

 {
 //alert(responce);

 }

});
           
      }
    });

  });
 
  </script>
  <?php
  }
  ?>
<div class="span12">

<div class='fulid-row'>

<?php
$a_id = Yii::app() -> controller -> action -> id;
$c_id = Yii::app() -> controller -> id;
?>
<div id="content-box">
<div id="element-box">
<div id="system-message-container"></div>
<div class="">
<div class="adminform">

<?php $this->renderPartial('_left_menu'); ?>
<div class="span10">
<div class="headerContent">
<h3 style="padding: 5px;">Manage Tables</h3>
<!-- <h1 style="font-style: italic; margin: 25px 0px 0px -408px;">Manage Menu Items</h1> -->

</div>
<div class="space"></div>

</div>

<div class="span10" style="">
<div class="cpanel-right right-side">
<div style="margin-left: 20px;float: left;">
<?php
$Tables = Table::model()->findAll('is_active = 1');


foreach($Tables as $Table){
if($Table->position==""|| $Table->position==Null){
$style="width:110px;margin-left: 20px;";
echo '<div id='.$Table->id.' style='.$style.'>';
}
elseif($Table->position!=""|| $Table->position!=Null){
$position=$Table->position;
$position=explode(",",$position);
$left=$position[0].'px';
$top=$position[1].'px';
$style="width:110px;left:$left;top:$top;";
echo '<div id='.$Table->id.' style='.$style.'>';
}
echo CHtml::image(Yii::app()->getBaseUrl().'/images/tables/'.$Table->image, 'Tables[]');
echo '</div>';


}

?>
</div>
<div style="margin-left: 200px;">

<div id="droppable"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Controller
public function actionUpdatePosition(){
$left= $_POST['left'];
$top = $_POST['top'];
$id = $_POST['id'];
$Table = new Table;
$Table->updatePosition($left,$top,$id);
//echo $top.",".$left;
}
Model
public function updatePosition($left=null,$top=null,$id=null)
{

$position =$left.",".$top;

$sql = "UPDATE `table` SET `position`='$position' WHERE id=:id";

$parameters = array(":id"=>$id);

Yii::app()->db->createCommand($sql)->execute($parameters);
}

No comments:

Post a Comment