«Переход на веб-страницу был отменен» IE 8. При публикации формы в IFrame

Question

Я получаю эту ошибку при попытке отправить форму через iFrame. В IE 8. в FF и Opera работает нормально.

Краткая версия проблемы: у меня есть сложная форма, которую я использую JavaScript, чтобы превратить в сложный объект json, а затем я превращаю ее в строку json. я добавляю на страницу форму со скрытым полем для строки json, клонами файловых элементов управления и отправляю эту форму с целью моего iframe.

Вот мой код тестирования:

    <div id="testingFormHolder">
<form id="IFrameSubmitForm">
    <input type="text" id='testText' name='testText' />
    <input type="file" id='testFile23' name='testFile' cfid="23" />
    <input type="file" id='testFile24' name='testFile' cfid="24" />
    <input type="button" id='testSubmit' name='testSubmit' />
</form>

</div>

<div id="TempFormHolder">

</div>
<div id="IFrameHolder" class="">

</div>

<script type="text/javascript">
    $(function () {
        $('#testSubmit').click(function () {
            var fileControls = $('#testingFormHolder').find('input[type=file]');
            var otherDataObject = { "field1": 'blah blah field 1', "field2": "field2" };
            var iframe = $('<iframe name="theIFrame" id="theIFrame" class="" src="about:none" />');
            var theFileNames = new Array();
            var thefiles = $('#testingFormHolder').find('input[type=file]');
            thefiles.each(function () {
                theFileNames.push({ cfid: $(this).attr('cfid'), FileName: $(this).val() });
            });

            otherDataObject.fileNames = theFileNames;
            var otherData = JSON.stringify(otherDataObject);

            $('#IFrameHolder').empty().append(iframe);

            var theForm = $('<form id="TempForm" name="TempForm">');
            fileControls.each(function () {
                theForm.append($(this).clone().attr('name', 'files').attr('id', $(this).attr('customFieldId')));
            });
            // theForm.append(fileControl.clone().attr('name', 'files').attr('id', 'file1'));
            theForm.append($("<input type='text' id='model' name='model' value='" + otherData + "' />"));

            theForm.attr('action', '<%= Url.Action(MVC.Temp.Actions.TestingFormSubmitThroughIFrame)%>');
            theForm.attr('method', 'POST');
            theForm.attr('enctype', 'multipart/form-data');
            theForm.attr('encoding', 'multipart/form-data');
            theForm.attr('target', 'theIFrame');
            $('#TempFormHolder').empty().append(theForm);

            theForm.submit();
           // $('#theIFrame').load(function () {


           // });

            return false;

        });

    });

</script>

я использую asp.net mvc. В то время как я искал ответ, я наткнулся на страницу, где говорилось о смешении http и https, но я просто запускаю его с локальным хостом. адрес тестовой страницы: http://localhost:60819/Temp/Testing/ и '<% = Url.Action (MVC.Temp.Actions.TestingFormSubmitThroughIFrame)%>' = "/ Temp / TestingFormSubmitThroughIFrame"

edit: и изменение действия на полный адрес вместо просто "/ Temp / TestingFormSubmitThroughIFrame" не исправило его.

Спасибо за помощь!

Редактировать: К сожалению об этом, я думал, что он скопировал все сообщение об ошибке! полное сообщение об ошибке:

«Переход на веб-страницу был отменен» "То, что вы можете попробовать: Повторите адрес.

"

, который появляется в моем iframe, когда он пытается подчиниться. он даже не пытается сделать пост.

Answer 1

Ну, я перешел на использование плагина jquery.form, и это похоже на работу! Я не уверен, что он делает по-другому. но я бы посоветовал это любому, чертовски легко использовать! Я не знаю, почему я не использовал его в первую очередь!

Вот как теперь выглядит код:

<script type="text/javascript">

        $(function () {
            $('#testSubmit').click(function () {
                var fileControls = $('#testingFormHolder').find('input[type=file]');
                var otherDataObject = { "field1": 'blah blah field 1', "field2": "field2" };

                var theFileNames = new Array();

                fileControls.each(function () {
                    theFileNames.push({ CustomFieldId: $(this).attr('customFieldId'), FileName: $(this).val() });
                });

                otherDataObject.cfNames= theFileNames;
                var otherData = JSON.stringify(otherDataObject);
                $('#TempFormHolder').empty();
                var theForm = $('<form id="TempForm" name="TempForm" action="http://localhost:60819/Temp/TestingFormSubmitThroughIFrame" />').appendTo('#TempFormHolder');
                fileControls.each(function () {
                    theForm.append($(this).clone().attr('name', 'files'));
                });


                theForm.append($("<input type='text' id='model' name='model' value='" + otherData + "' />"));

                theForm.ajaxSubmit({ target: '#ResultTarget' });

                return false;

            });

        });

    </script>

Надеюсь, это поможет кому-то в будущем.