페이지 새로 고침없이 jquery 행을 삭제하십시오

Question

행을 삭제하려면이 코드를 사용하고 있습니다. 내 코드가 잘 작동하고 있습니다. 모든 행에서 버튼 앞에있는 삭제가있는 datatables를 사용하고 있습니다 .. 원하는 것은 언제입니까? 확인 대화 상자가 나타나고 사용자가 ok를 누르면 행이 삭제되고 새로 고침없이 데이터 테이블의 나머지 행이 표시됩니다. 확인 버튼을 누르면 행이 삭제되고 그 행이 삭제됩니다. 테이블을 새로 고칠 때까지 테이블을 지우고 그 테이블에서 제거 할 수 있습니까? 그 이유는? 삭제를 누른 후 그 사용자가 행을 삭제했는지 여부를 확인하기 위해 새로 고침해야하기 때문입니다.

내 볼보기 사용자 이름입니다.

,210

  <td> <a href = "employesController/deleteEmploye/<?php echo $row->emp_id ?>" 
      class = "deletes" >Delete</td> 

내 jQuery 코드

<script type='text/javascript'> 
    $(document).ready(function(){ 
$(".deletes").click(function(e){ 
    var r = confirm("are you sure you want to delete this"); 

    if (r==true){ 
    $this = $(this); 
    e.preventDefault(); 
    var url = $(this).attr("href"); 
    $.get(url, function(r){ 
     if(r.success){ 
      $this.closest("tr").remove(); 
     } 
    }) 
    }else { 
     return false; 
     } 

    }); 
    }); 

내 컨트롤러

function deleteEmploye($empid){ 

    $id = $empid; 
    $this->load->model('employesModel'); 
    $query = $this->employesModel->deleteEmploye($id); 
    return json_encode(array("success" => true)); 

모델

public function deleteEmploye($id){ 

     $this->db->where('emp_id', $id); 
     $query = $this->db->delete('employees'); 

     return $query->result(); 


} 

Answer 1

당신이 DELE PHP에서 다른 스크립트로 보낼 jQuery를 사용할 수 있습니다 테이 행과 당신이 테이블

JQuery와

$.post("functions.php", { rowId: 1231 }, 
    function(data) { 
     if (data == "ok") 
      alert("the row has ben delete"); 
     else 
      alert("the row is not delete"); 

}); 

<?php 
    function delete_row(){ 
     //action to delete row in db 
     // when the row has bes delete you can print ok 
     echo 'ok'; 
     //if you have a error you can print a message that you can managed y jquery 
     echo "error 2121123" 
    } 
    if(isset($_post["rowId"])) 
     delete_row($_post["rowId"]);   

Answer 2

이 먼저 당신이 당신의 상태 블록이 호출되면 있는지 확인해야 PHP의이 행을 삭제할 수 있습니다 confirn합니다. 제대로 호출 될 경우,이 하나를 시도해보십시오 :

$this.parent('td').parent('tr').remove(); 

Answer 3

사용 방화범 (또는 파이어 폭스를 사용하지 않을 경우 비슷한 도구) 귀하의 아약스 전화를 디버깅 할 수 있습니다. "네트워크"탭에서 ajax 요청이 실제로 전송되었는지 여부와 반환되는 항목을 확인할 수 있습니다. 아니 당신이 기대하는 결과로 아약스를 반환 않습니다,

$.get(url, function(r){ 
    console.log("returned form ajax"); 
    if(r.success){ 
     console.log("successful, $this is now "); 
     console.dir($this); 
     $this.closest("tr").remove(); 
    } 
} 

당신은 발견 할 것이다이 방법을하지만, :

어떻게되는지 알아 코드에 CONSOLE.LOG 및 console.dir 문을 추가 : 데이터를 반환하기 만하면 이므로 r.success를 찾으면 항상 실패합니다.

사용하는 메소드는 두 개의 인수, 즉 URL과 성공시에만 호출되는 함수를 사용합니다.

$.get(url, function(r){ 
    $this.closest("tr").remove(); 
} 

가 완벽하게 작동 예를 들어 http://jsfiddle.net/bjelline/8RQQN/를 참조하십시오 그래서 당신은 모든 경우 문이 필요하지 않습니다.

---

또한 : 더하지 물건을 삭제를 얻을 사용하지! 대신 게시물을 사용하십시오!또한 크로스 사이트 요청 위조에 대해 생각해야 완전히 다른 사이트에 누군가가 직원을 삭제로 사용자를 속여 수있는 링크

<a href="http://yoursite.com/employesController/deleteEmploye/4">free beer here</a> 

을 추가 할 수 있습니다 - 심지어 몰래!

는 https://www.owasp.org/index.php/Cross-Site_Request_Forgery_%28CSRF%29_Prevention_Cheat_Sheet