jQuery之ajax刪除詳解

來源:互聯網
上載者:User

 ajax是局部重新整理。用jQuery來實現,會簡化很多。下面進行詳細的說明,結合一個ajax刪除的案例來進行

首先看html介面的代碼: <a href="javascript:;"  onclick="delete_order('<?php echo $item[order_id]; ?>')"><img src="images/admin/delete-icon.png" border="0" /></a>這個一個圖片連結,表示刪除。它並不跳轉到某個介面,而是點擊時出發click事件。 click事件執行delete_order()方法。這個方法中傳遞了一個參數,訂單號。通過這個參數,可以去執行相應的刪除操作。 下面jQuery代碼: 代碼如下:<script>    function delete_order(order_id){            confirm_ = confirm('This action will delete current order! Are you sure?');        if(confirm_){            $.ajax({                type:"POST",                url:'index.php/admin/order/del/'+order_id,                success:function(msg){                    //alert("test order");                    //all delete is success,this can be execute                    $("#tr_"+order_id).remove();                }            });        }    };</script> 首先出發一個提示框,確認刪除嗎? 如果確認的話,執行ajax操作。 在jQuery中,有一個$.ajax()的方法。 這裡有三個參數,一個是類型,這裡面用的是POST, 第二個是地址,這個很關鍵,它負責將資料,傳送到後台伺服器去執行。 第三個參數是一個回呼函數,如果執行刪除成功,就會執行的操作。這個時候,就可以執行一些動作,比如將這條已刪除的記錄,移除。結合的是下面的這行代碼。為沒條記錄,賦予一個動態id,作為刪除時使用的依據。這裡要注意的是,必須後台執行的所有都成功之後,才會執行這個回呼函數。 <tr id="tr_<?php echo $item['order_id']; ?>"></tr> 下面的是後台執行的代碼  代碼如下:function del() {    $order_id = $this->uri->segment(4);    if ($order_id > 0) {      $this->db->delete('billing', array('order_id' => $order_id));      $this->db->delete('shipping_address', array('order_id' => $order_id));      $this->db->delete('order_products', array('order_id' => $order_id));      $this->db->delete('comments', array('order_id' => $order_id));    }    $this->db->delete($this->tbname, array('id' => $order_id));  } 這個後台控制器中的一個方法,通過$this->uri->segment();方法擷取參數,將參數賦值給變數order_id。 然後,就可以在後台執行相應的刪除操作了。如果刪除都成功的話,就會有一個預設的資訊傳遞給success方法。 今天遇到的success方法執行不成功的原因,就是因為有一個刪除操作執行不成功,那個隱藏的資訊傳遞不到success方法。為什麼不成功呢?因為$this->db->delete('shipping_address', array('order_id' => $order_id));與資料庫中的表名不對應,大概是被別人修改了。 後來修正之後,success方法成功執行。  這是一個簡單的ajax執行個體。可以簡單的說明ajax的作用。不需要重新整理介面,直接偷偷的去後台進行操作即可,操作成功後,還可以執行相應的動作,通過jQuery來完成
相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.