How to redirecting page to another page using ajax jquery in codeigniter?

Question

am using codeigniter, am working shopping cart. after selecting of items to cart using ajax jquery. Here, items menu and cart table will be side by side displayed.

Now, my task is to copying cart items to another table, by clicking button,which is done. now problem is on clicking button i need to copied and at a time i need to route to another page.. here i can copy cart items to another table but i can't redirect to another.for this i used jquery ajax.

now i need route to page which in views folder users/basket.php

Home.php

<?php
     defined('BASEPATH') OR exit('No direct script access allowed');
?>
<div class="row">
     <div class="col-lg-12 text-center">
     <?php if(isset($_SESSION['loggedin'])){?>
         <div class="alert alert-success"><?php echo $_SESSION['loggedin'];?></div>
     <?php } ?>
     Hello, <?php echo $_SESSION['username']?>
     </div> 
</div>
<div class="row">
    <div class="col-lg-3">
        <table class="table table-condensed table-hover">
            <tr>
                <th class="text-center">Item</th>
                <th class="text-center">Quantity</th>
                <th class="text-center">Price</th>
                <th class="text-center">Add</th>
            </tr>
            <?php foreach($items as $item):?>

            <tr class="success">         
                <td><?php echo $item['product_name'];?></td>
                <td class="text-center"><input type="text" name="quantity" id="<?php echo $item['product_id'];?>" class="quantity" maxlength="2" size="2"></td>
                <td><?php echo $item['product_price'];?></td>
                <td><button type="button" name="add_cart" class="add_cart" data-productname="<?php echo $item['product_name'];?>" data-price="<?php echo $item['product_price'];?>" data-productid="<?php echo $item['product_id'];?>"><i class="fa fa-plus-circle"></i></button></td>
             </tr>
             <?php endforeach; ?>
        </table>
     </div>
     <div class="col-lg-6 col-lg-offset-1">
          <div id="cart_details" class="text-center">
          </div>
     </div>
</div>

Product_controller.php:

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Products extends CI_Controller {

public function add(){
    $this->load->library('cart');
    $data = array(
        'id' => $_POST["product_id"],
        'name' => $_POST["product_name"],
        'qty' => $_POST["quantity"],
        'price' => $_POST["product_price"],   
    );
    $this->cart->insert($data); //return rowid
    echo $this->view();     
}
public function load(){
    echo $this->view();
}
public function remove(){
    $this->load->library('cart');
    $row_id = $_POST["row_id"];
    $data = array(
        'rowid' => $row_id,
        'qty' => 0
    );
    $this->cart->update($data); 
    echo $this->view();
}
public function clear(){
    $this->load->library('cart');
    $this->cart->destroy();
    echo $this->view();
}
public function view(){
    $this->load->library('cart');
    $output = '';
    $output.='
    <h3>Shopping cart</h3><br/>
    <div class="table-responsive">
        <div align="right">
            <button type="button" id="clear_cart" class="btn btn-danger"><i class="fa fa-trash-o" aria-hidden="true"></i></button>
        </div>
        <br/>
        <table class="table table-bordered">
            <tr>
                <th class="text-center">Name</th>
                <th class="text-center">Quantity</th>
                <th class="text-center">Price</th>
                <th class="text-center">Total</th>
                <th class="text-center">Action</th>
            </tr>';
            $count = 0;
            $content=$this->cart->contents();
            foreach($content as $items){
                $count++;
                $output .='
            <tr>
                <td>'.$items["name"].'</td>
                <td>'.$items["qty"].'</td>
                <td>'.$items["price"].'</td>
                <td>'.$items["subtotal"].'</td>
                <td><button type="button" name="remove" class="btn btn-danger btn-xs remove_inventory" id="'.$items["rowid"].'"><i class="fa fa-times" aria-hidden="true"></i></button></td>
            </tr>';
            }
            $output .='
            <tr>
                <td colspan="4" align="right">Total</td>
                <td>'.$this->cart->total().'</td>
            </tr>
        </table>
        <button type="submit" name="basket" class="btn btn-danger btn-lg basket" ><i class="fa fa-shopping-cart" aria-hidden="true"></i></button>
    </div>';
    if($count == 0){
        $output = '<h3>Cart is Empty</h3>';
    }
    return $output;
}
public function basket(){
    if ($cart = $this->cart->contents()){
        foreach ($cart as $item){
        $order_detail = array(
            'tblItemsID' => $item['id'],
            'tblLoginID' => $this -> session -> userdata('user_id'),
            'Qty' => $item['qty'],
            'price'    => $item['price'],
            'total'    => $item['subtotal']
         );
         $this->db->insert('tblShoppingCart', $order_detail);
         }
     }  
  }              

}

Note:In product_controller.php i coded button to copy cart items to another table. on button click event i wrote in jquery ajax below

jquery Ajax:

<script>
$(document).ready(function(){
$('.add_cart').click(function(){
var product_id=$(this).data("productid");
var product_name=$(this).data("productname");
var product_price=$(this).data("price");
var quantity=$('#' + product_id).val();
if(quantity != '' && quantity >0)
{
$.ajax({
url:"<?php echo base_url();?>products/add",
method:"POST",
data:{product_id:product_id,product_name:product_name,product_price:product_price ,quantity :quantity},
success:function(data)
{
alert("Product Added into cart");
$('#cart_details').html(data);
$('#' + product_id).val('');
}
});
}
else
{
alert("Please Enter Quantity");
}
});
$('#cart_details').load("<?php echo base_url();?>products/load");
 $(document).on('click','.remove_inventory',function(){
        var row_id = $(this).attr("id");
        if(confirm("Are you sure you want to delete item")){
            $.ajax({
                url:"<?php echo base_url();?>users/remove",
                method:"POST",
                data:{row_id:row_id},
                success:function(data)
                {
                alert("Product remove fromm cart");
                $('#cart_details').html(data);
                }
            });
        }else{
            return false;
        }
    });
$(document).on('click','#clear_cart',function(){

if(confirm("Are you sure you want to delete item"))
{
$.ajax({
url:"<?php echo base_url();?>products/clear",

success:function(data)
{
alert("Are you sure you want clear cart?");
$('#cart_details').html(data);

}
});
}
else{
return false;
}
});
$(document).on('click','.basket',function(){

if(confirm("Are you sure you want to delete item"))
{
$.ajax({
url:"<?php echo base_url();?>products/basket",
method:"POST",
success:function(data)
{
alert("Are you sure?");
window.location="users/basket";

}
});
}
else{
return false;
}
});

});

</script>
----------

Answer 1

after ajax success just write.

window.location.href="redirect_location_name";

Answer 2

Use this code on your needed redirect place: where you will retrieve the response via ajax success response (date);
before that you will return the value in server side which mean controller.

$.ajax({
url:"<?php echo base_url();?>products/basket",
method:"POST",
success:function(data)
{
alert("Are you sure?");
location.href = data.url_path;

}
});

Answer 3

Use window.location.href

$.ajax({
  url:"<?php echo base_url();?>products/basket",
  method:"POST",
  success:function(data)
  {
     alert("Are you sure?");
     window.location.href="<?php echo base_url();?>users/basket";

  }
});