Question

I’m having problem trying to request new page(s) from CodeIgniter using JQuery Ajax and open them in a new blank page

The following is the example scenario of current code which is working,

1.) User select the customer’s receipt by checkbox

<input type='checkbox' class='customer_id' value='<?php echo $entry->customer_id;?>'>

2.) Javascript read the customer(s) id then send those data to CodeIgniter. Once return data is received, fire callback function to display them target div

var data;
var counter = 1;
$(.customer_id:checked).each(function(){
    data['customer_' + counter] = $(this).val();
})    
$.post('finance/getReceipt', data, function(){
    $('#some_target_div').html(data);
}

3.) CodeIgniter retrieve customer data from db and generate page

function getReceipt(){
    $counter = 1;
    while ($this->input->post('customer_' + $counter)){
        $where['customer_id'] = $this->input->post('customer_' + $counter);
        $data += $this->getCustomerReciept($where);
    }
    $this->load->page('finance/receipt', $data);
}

But now I need to convert this code to make it open a new blank page with a print button

The purpose of this is because I want to generate a formatted receipt and display in a new blank page with a print button. I know that there are several plugin that I can print a div but this is the request from my client. So, that’s isn’t a solution for me.

Any suggestion or comment will be great. Thank in advance.

Answer 1

I think the easiest way would be to create an auxiliar form to post your data to a new page instead of using $.post So, this would be the code:

var data;
var counter = 1;
$(.customer_id:checked).each(function(){
    data['customer_' + counter] = $(this).val();
});
$('<form action="finance/getReceipt" method="POST" target="_blank" style="display:none">' +
'<input type="hidden" name="data1" value="value-data1" />'
).appendTo("body").submit().remove();

Just change your data1 param to the one you want, or add more if you want.
And that’s it. The magic is in using a _blank target for the form.

Hope this helps. Cheers

PS: The other way would be creating a new window with window.open and assign its content with javascript.