Question

Would anyone be able to tell me what I’m doing wrong in the following code that the form is not being submit to the iframe?

$(function() {
    $(".preview").click(function() {
        $('#sliderimage').wrap('<form action="/index/upload.php" method="post" id="imageform" target="imageupload" />');
        $('#imageform').submit();
        $('#sliderimage').unwrap();
        return false;
    });
});​


<iframe style="display: none;" name="imageupload" id="imageupload"></iframe>
<input type="file" id="sliderimage" name="sliderimage">
<input type="button" class="preview" value="Preview">

Answer 1

There are two problems I see right away, not sure if they will solve the issue or not.

You have set the ‘type’ to post. this attribute should be method.

as well you need to set the enctype on the form.

$(function() {
    $(".preview").click(function() {
        $('#sliderimage').wrap('<form action="/index/upload.php" method="post" id="imageform" target="imageupload" enctype="multipart/form-data" />');
        $('#imageform').submit();
        $('#sliderimage').unwrap();
        return false;
    });
});​

EDIT

The code above is a direct cut and paste from your source…. this means the ‘hidden'(​) character jsfiddle pastes into your javascript is also there. remove it and you js will function. to do this simply backspace at the end of your js code once.