force download in jquery loaded div [ codeigniter ]

Hello all,

I have this codeigniter question.

I have created a force download link and this works perfectly. It is a controller with the method 'download' This gets some data and load the view that actually forces the download.

If I load this view (with jquery) into a div the raw data of the file is displayed, and there is no download.

Does anybody know why this is? I need to load it with jquery, do some other tasks and then force the download.

Hope someone can help me.

class Kleurplaten extends CI_Controller {

	public function __construct(){
        public function download_kleurplaat($id){
            // load data
            $content_data['kleurplaat'] = $this->kleurplaten_model->get_single_coloring_page($id);
            if (empty($content_data['kleurplaat'])){
            $this->load->view('pages/kleurplaten_download', $content_data);


Open in new window



// do some fancy stuff here...

$data = file_get_contents(base_url().'images_upload/'.$kleurplaat['colpic_asset_location']); // Read the file's contents
$name = 'myphoto.jpg';

force_download($name, $data);

Open in new window

Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

what are you exactly (and how) loading into a div? Can you post a code related to this too?
Which file is displayed in the div? The view? Or the image?
wal_toorAuthor Commented:
Hello feri,

I am using jquery to load the data into a div:

        var content_id = $(this).attr('rel'); // id of content is a rel attribute
        var content_holder = $(this).parent().find(".kleurplaat_download");
        var content_to_load = siteroot+'/kleurplaten/download/'+content_id;
        // load and process

       content_holder.load(content_to_load, function(response, status, xhr) {
            if (status == "error") {
                //error, do stuff
            }else if(status == "success"){
                //succes, do stuff


Open in new window

It works, but de loaded view (where the download is initiated) shows only raw image data, no download.

But when I addres the url like is works perfect

kleurplaten - controller
download_kleurplaat - method
9 - argument (id)

Hm, try to replace the call of content_holder.load(...) (the whole block) with this:
location.href = content_to_load;
To clarify things, if You use jquery's load function, it's just a shortcut to the $.ajax method, it gets some content with ajax and replaces the given DOM node with this content, in Your case by an image (i guess).
Force download works only in the browsers, javascript has no (easy) way to save content to the user's disk, it's for security reasons.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
wal_toorAuthor Commented:
Hi Frisoft, Ahaa... this seemed to be the issue. Thanks for pointing this to me. I have found another solution to get this working.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.