IE8 is submitting the form to the current page

It's working in all other browsers, and it was working on IE8 before, but I did some code cleanup and moved some things around, and now its submitting this form to it's self. It's an "ajax" uploader (yes, not really ajax, but you know what I mean)

Here is the JS:

function file_upload($theform,item_id){
    $theform.attr('ACTION','io.cfm?action=updateitemfile&item_id='+item_id);
    if($theform.find('[type=file]').val().length > 0){
        $('iframe').one('load',function(){
            $livepreview.agenda({
                action:'get',
                id:item_id,
                type:'item',
                callback:function(json){
                    $theform.siblings('.upload_output').append('<li style="display:none" class="file-upload"><a target="blank" href="io.cfm?action=getitemfile&item_file_id='+json[0].files.slice(-1)[0].item_file_id+'">'+json[0].files.slice(-1)[0].file_name+'</a> <a style="color:red" title="Delete file?" href="#deletefile-'+json[0].files.slice(-1)[0].item_file_id+'">[X]</a></li>').children('li').fadeIn();
                    $theform.siblings('.upload_output').find('.nofiles').remove();
                }
            });
            //Resets the file input. The only way to get it cross browser compatible as resetting the val to nothing
            //Doesn't work in IE8. It ignores val('') to reset it.
            $theform.append('<input type="reset" style="display:none">').children('[type=reset]').click().remove();
        });
    }
    else{
        $.alert('No file selected');
        return false;
    }
}
/* FILE UPLOAD EVENTS */
//When they select "upload" in the modal
$('.agenda-modal .file_upload').live('submit',function(event){de
    file_upload($('.agenda-modal .file_upload'),$('.agenda-modal').attr('data-defaultitemid'));
});

If you didn't know, ACTION has to be capitalized for Firefox to work. Also, i know for sure it's submitting to it's self because the iframe shows the current page inside of it's self and all the scripts get loaded again. Also, in the .live(), adding return false; does nothing.

Here is the HTML just in case:

        <label>Add Attachment</label>
        <form class="file_upload" method="post" enctype="multipart/form-data" target="upload_target" action="">
            <i开发者_开发知识库nput name="binary" id="file" size="27" type="file" /><br />
            <br><input type="submit" name="action" value="Upload" /><br />
            <iframe class="upload_target" name="upload_target" src="" style="display:none"></iframe>
        </form>
        <label>Attachments</label>
        <ul class="upload_output">
        <li class="nofiles">(No Files Added, Yet)</li>
        </ul>

It is supposed to send the form to itself.

Consider that the button is of type submit (ie submits form automatically) and that the form action is empty (ie, send it self).

However, as you've correctly done, a submit handler may cause the form to not submit at all (to which I ask, what was the point of submitting in the first place? But that's past the point)

Anyway, you should stop event propagation and return false in your event handler.

You should return false; at the end of your "submit" handler.

ah - well that's hard to understand. OK well where exactly is this <iframe> defined? edit — oh duhh I see it.

edit again — OK I realize I'm sort-of jumping up and down on thin ice with my credibility here, but I suggest adding an "id" attribute to the <iframe> (with "upload_target" as the id value). Every once in a while I figure out exactly which one of "name" and "id" is important (and when/why), but that information only lasts an hour or so before my brain perversely dismisses it. (By "important" I mean specifically with <iframe> elements.)