Ajax removal details for jQuery

  • 2020-03-30 02:08:49
  • OfStack

First look at the HTML interface code:

< A href = "javascript:;"   The onclick = "delete_order (' < ? PHP echo $item [order_id]; ? > ') "> < Img SRC = "images/admin/delete - icon. PNG" border = "0" / > < / a> This is a link to an image, which means delete. Instead of jumping to an interface, it starts the click event when clicked.

The click event executes the delete_order() method. This method passes a parameter, the order number. With this parameter, you can perform the corresponding delete operation.

The following jQuery code:


<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>

First start a prompt box, confirm to delete?

If so, perform the ajax operation.

In jQuery, there is a $.ajax() method.

There are three parameters, one is the type, and this is POST,

The second is the address, which is the key, which is responsible for sending the data to the backend server for execution.

The third argument is a callback function that performs the operation that will be executed if the deletion succeeds. At this point, you can perform some actions, such as removing the deleted record. The combination is the following line of code. For each record, a dynamic id is given as the basis for deletion. The important thing to note here is that the callback function will not be executed until everything executed successfully in the background.

< Tr id = "tr_ < ? PHP echo $item [' order_id ']; ? >" > < / tr>

Below is the code that executes in the background


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));
  }

One of the methods in this background controller is $this-> Uri - > Segment (); Method gets the parameter and assigns the parameter to the variable order_id.

You can then perform the corresponding delete operation in the background. If the deletions are successful, a default message is passed to the success method.

The reason for the unsuccessful success method execution encountered today is that there was an unsuccessful delete operation, and the hidden message failed to pass the success method. Why not? Because $this - > The db - > Delete (' shipping_address ', array (' order_id = > $order_id)); With the database table name does not correspond to, is probably modified by someone else.

After a later fix, the success method executes successfully.


This is a simple ajax example. You can simply illustrate what ajax does. Do not need to refresh the interface, directly secretly go to the background operation can be, after the operation is successful, you can also perform the corresponding action, through jQuery to complete


Related articles: