• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Draggable Jquery

#1
Hi all,

i have made an application in which i have used the draggable fields. what i actually want is that i want to save the position of the draged section. please help me to solve that problem. my code is as below:-
VIEW:
PHP Code:
 <div class="col-lg-2 connectedSortable">
        
 <h3>Prospect</h3>
        
     <?php
    
foreach($records as $row)
    {
 
    ?>

          <div class="small-box bg-blue">

        
         
        <div class="box box-solid bg-blue ">
            <div class="box-header ui-sortable-handle" style="cursor: move;">
                <h3 class="box-title"><i class="fa fa-user"></i>Leads</h3><br>
                    <h4><?php echo $row->l_name;?></h4>
                    
          <input type="hidden" name="stage" value="<?php echo $row->l_id?>" >
            <a href="<?php echo base_url("admin/leads/leadsdashboard?ids=".$row->l_id); ?>
        class="pull-right bg-blue">&nbsp;More info <i class="fa fa-arrow-circle-right"></i></a>
        </div>
 
 </div>
            
          <?php if($this->session->flashdata('error')){?>
  <div class="alert alert-danger">
    <?php echo $this->session->flashdata('error')?> 
  <?php ?>
 
  </div>
    

<?php ?> 
             
        </div>     

    
      <div class="col-lg-2 connectedSortable">
     <h3>offer</h3>
                     <?php
    
foreach($offer as $row)
    {
 
    ?>
          <div class="small-box bg-aqua">

    
        <div class="box box-solid bg-aqua ">
            <div class="box-header ui-sortable-handle" style="cursor: move;">
                <h3 class="box-title"><i class="fa fa-user"></i>offer</h3><br>
                        <h4><?php echo $row->l_name;?></h4>
                    
          
            <a href="<?php echo base_url("admin/leads/leadsdashboard?ids=".$row->l_id); ?>" class="pull-right bg-aqua">&nbsp;More info <i class="fa fa-arrow-circle-right"></i></a>
        </div>
 
 </div>
            
    
 
             
        </div>    
            <?php }?>
        </div>  

    
       <div class="col-lg-2 connectedSortable">
     <h3>In Negotiation</h3>
                      <?php
    
foreach($negotiation as $row)
    {
 
    ?>
          <div class="small-box bg-teal">

    
        <div class="box box-solid bg-teal ">
            <div class="box-header ui-sortable-handle" style="cursor: move;">
                <h3 class="box-title"><i class="fa fa-user"></i>In Negotiation</h3><br>
                     
                        <h4><?php echo $row->l_name;?></h4>
          
            <a href="<?php echo base_url("admin/leads/leadsdashboard?ids=".$row->l_id); ?>" class="pull-right bg-teal">&nbsp;More info <i class="fa fa-arrow-circle-right"></i></a>
        </div>
 
 </div>
            
    </div>    
    <?php }?>
        </div>  
        
      <div class="col-lg-2  connectedSortable">
         <h3>Closing</h3>
                              <?php
    
foreach($closing as $row)
    {
 
    ?>
          <div class="small-box bg-orange">

    
        <div class="box box-solid bg-orange ">
            <div class="box-header ui-sortable-handle" >
                <h3 class="box-title"><i class="fa fa-user"></i>Closing</h3><br>
                     <h4><?php echo $row->l_name;?></h4>
                    
          
            <a href="<?php echo base_url("admin/leads/leadsdashboard?ids=".$row->l_id); ?>" class="pull-right bg-orange">&nbsp;More info <i class="fa fa-arrow-circle-right"></i></a>
        </div>
 
 </div>
            
    </div>    
    <?php }?>
        </div>  
         <div class="col-lg-2  connectedSortable">
     <h3>Invoicing</h3>
                              <?php
    
foreach($invoicing as $row)
    {
 
    ?>
          <div class="small-box bg-green">

    
        <div class="box box-solid bg-green ">
            <div class="box-header ui-sortable-handle" style="cursor: move;">
                <h3 class="box-title"><i class="fa fa-user"></i>Invoicing</h3><br>
                     
                    <h4><?php echo $row->l_name;?></h4>
          
            <a href="<?php echo base_url("admin/leads/leadsdashboard?ids=".$row->l_id); ?>" class="pull-right bg-green">&nbsp;More info <i class="fa fa-arrow-circle-right"></i></a>
        </div>
 
 </div>
            
    </div>    
    <?php }?>
        </div>  
<script>
        <!-- ./col -->
     $('.connectedSortable').connectedSortable({
    connectWith: '.connectedSortable',
    update: function(event, ui) 
    {
        alert(ui.item.attr('l_id'));
        var id = ui.item.attr('l_id');
        updateDB(id);
    }
});

function updateDB(id) {
    $.ajax({
       //grab script, pass id and update database 
    });
}
</script> 
 
i want to drag the section to other stages and save the value oin database i m not finding a headway how to do that. kindly help.

how can i code for model and controller . just want basic idea. i am not understanding how it can be done.

thanks in advance
Reply

#2
See This
What did you Try? What did you Get? What did you Expect?

Joined CodeIgniter Community 2009.  ( Skype: insitfx )
Reply

#3
(12-12-2016, 09:56 AM)InsiteFX Wrote: See This

Hi dear,
the boxes arent getting dragged.
Reply

#4
Did you download and add the jQuery UI?

You need to incluse it just like jQuery.
What did you Try? What did you Get? What did you Expect?

Joined CodeIgniter Community 2009.  ( Skype: insitfx )
Reply

#5
(12-13-2016, 05:05 AM)InsiteFX Wrote: Did you download and add the jQuery UI?

You need to incluse it just like jQuery.

hi dear, 
i need to save the position of the draggable section. and update the database values accrdingly. i have included the jqueries the sections i m able to drag but i need to save the position.

thanks in advance
Reply

#6
The d.dragable is were they are saving the json positions to the browser local storage.

You would need to change that to do an ajax call to a method in your controller to save
the positions to the database.

This is for a mouse position you would need to change it to the dragged positions.

Write the php to access a CI Controller method to get and save.

Simple Draggable Element Persistence with jQuery
What did you Try? What did you Get? What did you Expect?

Joined CodeIgniter Community 2009.  ( Skype: insitfx )
Reply


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2020 MyBB Group.