Question

我在我的CodeIgniter驱动的应用程序中使用Bootstrap进度条进行文件上传。表单视图是：

<form id="upload_form" role="form" method="POST" action="<?php echo site_url('admin/videos/create_video'); ?>" enctype="multipart/form-data">

    <div class="form-group">
        <label class="control-label">Video Title</label>
        <input type="text" class="form-control" name="video_title" id="video_title" value="<?php echo set_value('video_title');?>" required="required" />
        <?php echo form_error('video_title'); ?>
    </div>

    <div class="form-group">
        <label class="control-label">Select File</label>
        <input type="file" name="video" id="video" required="required" onchange="uploadOnChange(this.value)" />
        <?php echo form_error('video'); ?>
        <div class="alert alert-danger" id="filename_error" style="display:none"></div>
    </div>

<div class="form-group">
    <button id="upload_button" type="submit" class="btn btn-large btn-success" name="createvenuebtn" value="New Video">Upload</button>
    <a href="<?php echo base_url('admin/videos'); ?>" class="btn btn-large btn-danger">Cancel</a>
</div>

<div class="progress progress-striped active">
    <div class="progress-bar"  role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
    <span class="sr-only">0% Complete</span>
    </div>
</div>

<div class="response"></div>

</form>

这是在处理上传时控制进度条的JavaScript：

$(function(){
                 // function from the jquery form plugin
                 $('#upload_form').ajaxForm({
                    beforeSend:function(){
                         $(".progress").show();
                    },
                    uploadProgress:function(event,position,total,percentComplete){
                        $(".progress-bar").width(percentComplete+'%'); //dynamicaly change the progress bar width
                        $(".sr-only").html(percentComplete+'%'); // show the percentage number
                    },
                    success:function(){
                        $(".progress").hide(); //hide progress bar on success of upload
                    },
                    complete:function(response){

                        if(response.responseText == '0') {
                            $(".response").html("<div class='alert alert-dismissable alert-success'>Success! You are being redirected...</div>");
                            window.location = "<?php echo base_url('admin/videos'); ?>";
                        }

                        else if (response.responseText == '1') {
                            $(".response").html("<div class='alert alert-dismissable alert-danger'>Please select a file!</div>");
                            //window.location = "<?php echo base_url('admin/videos'); ?>";
                        }

                        else if (response.responseText == '2') {
                            $(".response").html("<div class='alert alert-dismissable alert-danger'>Please insert appopriate data!</div>");
                        }

                        else if (response.responseText == '3') {
                            $(".response").html("<div class='alert alert-dismissable alert-danger'>Upload error... Please try later!</div>");
                        }
                    }
                 });

                 //set the progress bar to be hidden on loading
                 $(".progress").hide();
            });

上传处理器是CI控制器，用于验证，文件上传和数据库更新。该脚本在FF和Chrome中运行良好，但在Safari中（当所有输入都通过验证时）我收到消息“上传错误...请稍后再试！”＃39;并且文件无法上传。任何帮助/建议将受到高度赞赏！

在Safari中使用进度条上传CodeIgniter

0 个答案: