douran7929 2014-04-04 14:10 采纳率: 100%
浏览 52
已采纳

在模态中上传iframe

I have a modal containing a form and an iframe. The form has a file field and post to the iframe.

The php controller return the uniqid (basically the name) of the uploaded file. The upload works well and my iframe contains the uniqid.

I would like to display this uniqid on my main page.

My issue is that I don't know how to wait the end of the upload to show the uniqid.

The form and iframe :

<form id="uploadForm" enctype="multipart/form-data" action="{{ path('lesson_upload') }}" target="uploadFrame" method="post">
    <label for="uploadFile">Document :</label>
    <input id="uploadFile" name="uploadFile" type="file" />
    <br /><br />
    <input class="btn btn-primary" id="uploadSubmit" type="submit" value="Upload" />
</form>
<div id="uploadInfos">
    <div id="uploadStatus">Aucun upload en cours</div>
    <iframe hidden id="uploadFrame" name="uploadFrame"></iframe>
</div>

The JavaScript to fill the modal with the form :

$(document).on('click', '#computer-upload', function ()
    {
        var url = Routing.generate('lesson_upload_computer');
        $.get(url, function (data)
        {
            $('#modal-various .modal-body').html(data);
            return false;
        });
        return false;
    });

The iframe at the end of an upload :

<div id="uploadInfos">
    <div id="uploadStatus">Aucun upload en cours</div>
    <iframe hidden="" id="uploadFrame" name="uploadFrame">
    #document
        <html>
            <body>
                <body>533ebac647b7e</body>
            </body>
        </html>
    </iframe>
</div>

Does anyone have an idea ?

Thanks !

  • 写回答

2条回答 默认 最新

  • doucheng4660 2014-04-11 07:48
    关注

    If you don't use an AJAX upload, after a little research, you cannot add an event that detects when the upload has finished.

    You now have 2 options:

    Fetch the id from the iframe every ~100ms and if it is not empty or null, the id will be in:

    document.checkForId = function() {
        id = $('#uploadFrame').contents().find('#idInIframeDivOrOtherContainer');
        if (id) {
            window.clearInterval(intervalId);
        }
    
    };
    $(document).ready(function() {
        intervalId = window.setInterval('document.checkForId', 100);
    });
    

    When posting data, return javascript that sets the id in the main page (if you have jquery in the iframe):

    <script>
    $(document).ready(function() {
        $('#divInParentWindow', parent.document).text('<?php echo $id; ?>');
    });
    </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥30 自适应 LMS 算法实现 FIR 最佳维纳滤波器matlab方案
  • ¥15 lingo18勾选global solver求解使用的算法
  • ¥15 全部备份安卓app数据包括密码,可以复制到另一手机上运行
  • ¥15 Python3.5 相关代码写作
  • ¥20 测距传感器数据手册i2c
  • ¥15 RPA正常跑,cmd输入cookies跑不出来
  • ¥15 求帮我调试一下freefem代码
  • ¥15 matlab代码解决,怎么运行
  • ¥15 R语言Rstudio突然无法启动
  • ¥15 关于#matlab#的问题:提取2个图像的变量作为另外一个图像像元的移动量,计算新的位置创建新的图像并提取第二个图像的变量到新的图像