CakePHP에서 jQuery 애니메이션 'delete entry'효과 사용 하시겠습니까?

Question

프레임 워크를 사용하여 블로그를 만드는 데있어 매우 기본적인 (그러나 화려한) CakePHP 튜토리얼을 따라합니다.

나는 모험심이 많으므로 이것을 사용해보십시오. Animated AJAX Record Deletion Using jQuery 효과는 my Delete entry script입니다.

내가 어떻게이 작업을 수행 할 수 있는지 설명 할 수 있습니까?

Answer 1

//Your view action: 
<?php 

function index() { 
    //Provide your pagination info.. 
    $this->set('entries', $this->paginate()); 
} 
?> 

//Your delete action: 
<?php 

function delete($id) { 
    $this->autoRender = false; 
    if ($this->Blog->delete($id)) { 
     $response = array("success" => true); 
    } else { 
     $response = array("success" => false); 
    } 
    return json_encode($response); 
} 
?> 

//Your index.ctp 
..... 
<?php foreach ($entries as $entry): ?> 
    <div class="record"> 
     <a href="<?php echo $this->Html->url(array("controller" => "blog", "action" => "delete", $entry['Blog']['id'])) ?>" class="delete">Delete</a> 
     <strong><?php echo $entry['Blog']['title'] ?></strong> 
    </div> 
<?php endforeach; ?> 

//Your Javascript 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('a.delete').click(function(e) { 
      var __this = this; 
      e.preventDefault(); 
      var parent = $(this).parent(); 
      $.ajax({ 
       type: 'get', 
       url: $(__this).attr("href"), 
       beforeSend: function() { 
        parent.animate({'backgroundColor':'#fb6c6c'},300); 
       }, 
       success: function(response) { 
        //Changed here 
        response = $.parseJSON(response);//console.log(response); 
        if(response.success){ 
         parent.slideUp(300,function() { 
          parent.remove(); 
         }); 
        }else{ 
         alert("Failed to delete message"); 
         parent.animate({'backgroundColor':'#fff'},100);//Restore your background back 
        } 
       } 
      }); 
     }); 
    }); 
</script>