Using iframe with CI file uploader

[eluser]RobbieL[/eluser]
I'm using the iframe trick with CI to give the illusion of an ajax-like file uploader. What I've got so far doesn't seem to work, but I have the foggiest why.

View:

Code:

<iframe name="hiddenFrame" id="hiddenFreame" src="about:blank" style="display:none"></iframe>

<form name="feedback" id="feedback" method="post" action ="http://localhost:8888/honours/index.php/music/upload" enctype="multipart/form-data" target="hiddenFrame">
&lt;input type="file" name="userfile" id="userfile" /&gt; <br />
&lt;input type="submit" value="upload" /&gt;
&lt;/form&gt;

music.php controller:

Code:

function upload()
{
    $config['upload_path'] = './uploads/';
    $config['allowed_types'] = 'mp3';
    $config['max_size']    = '8000';
        
    $this->upload->initialize($config);
        
    if ( ! $this->upload->do_upload())
    {
        print "Uploading ...";
    }    
    else
    {    
        print "Uploaded";
    }
}

What currently happens is, when the I select a file to upload and click submit, the entire page refreshes and then "Uploaded" is printed in the iframe. From what I gather, isn't only the iframe meant to refresh, and because it's hidden, give the illusion of an unobtrusive upload form?

[eluser]RobbieL[/eluser]
Just incase anyone needs to know, I manage to get it working by adding in the target attribute on the form using JavaScript. No idea why that solved it. But it seemed to do the trick.

[eluser]Seppo[/eluser]
Mmm... maybe because a typo in the iframe ID? (id="hiddenFreame")

[eluser]RobbieL[/eluser]
Yeah, spotted that. Still couldn't get it working. The daft javascript method was the only thing to get it working at my end.