douyu4822 2014-10-30 17:48
浏览 54
已采纳

PHP + jQuery Upload再次包含我的网站状态

so I searched the internet for a multi-upload possibility, which shows a progress bar while uploading. As there are many out there, I quickly found one which suited my needs.

Now I am encountering a problem after the upload has finished. As soon as the upload is finished, it should show me the status of the upload "File [number]: Filename (size) has been uploaded" in a DIV. However it does not only show me the status but it includes my website layout again as a duplicate.

Please could somebody help me with this as I was sitting on it a whole day and could not find the error :(

This is the HTML+Form:

<div id="main">
<form id="pupload" action="upload.php" method="POST" enctype="multipart/form-data">
    <fieldset class="tabulated">
        <table id="down" class="bbcode_table" cellspacing="1">
            <thead>
                <tr class="Cnorm">
                    <td><input type="file" name="files[]" multiple="multiple" id="files"></td>
                </tr>
            </thead>
            <tbody>
                <tr class="Cmite">
                    <td><input id="submit" class="button1" type="submit" value="Upload"></td>
                </tr>
            </tbody>
        </table>
    </fieldset>
</form>
<div class="progress">  
        <div class="bar"></div>  
        <div class="percent">0%</div>  
</div>
{msg}
<div id="status"></div>

<script>  
    jQuery(document).ready(function ($) {
    "use strict";

var bar = $('.bar');
var percent = $('.percent');
var status = $('#status');

$('form').ajaxForm({
beforeSend: function() {
    status.empty();
    var percentVal = '0%';
    bar.width(percentVal);
    percent.html(percentVal);
},
uploadProgress: function(event, position, total, percentComplete) {
    var percentVal = percentComplete + '%';
    bar.width(percentVal);
    percent.html(percentVal);
},
success: function(data, statusText, xhr) {
    var percentVal = '100%';
    bar.width(percentVal);
    percent.html(percentVal);
    status.html(xhr.responseText);
},
error: function(xhr, statusText, err) {
    status.html(err || statusText);
}
}); 

});
</script>
</div>

The required jQuery files are being called in the websites header.

This is the PHP Code to it:

    <?php 

defined ('main') or die ( 'no direct access' );

$main_dir = 'include/downs/public-upload/';

// Upload dirs sorted by file types
$files = $main_dir.'files/';
$images = $main_dir.'images/';
$media = $main_dir.'media/';
$video = $main_dir.'video/';

// File extensions
$files_ext = array('apk','exe','doc','docx','docm','gadget','html','ini','pdf','php','rar','sh','txt','xlsx','zip');
$images_ext = array('gif','jpg','JPG','jpe','jpeg','JPEG','png','PNG');
$media_ext = array('mp3','ogg','wav');
$video_ext = array('avi','mp4','3gp');

$msg = '';
        // Check rights first to make sure we can put the file in the directory
        if (!is_writeable ($main_dir)) {
                $msg = 'The folder "include/downs/<b>public-upload</b>/" requires WRITE ( chmod 777 ) permission!!! Please set the WRITE ( chmod 777 ) permission and reload the page.';
        }
        // Now we can upload our file
        $tpl = new tpl ( 'admin/pupload/pupload_upload' );
            if ($_SERVER['REQUEST_METHOD'] == 'POST' and isset($_FILES['files']))
            {
                // loop all files
                foreach ( $_FILES['files']['name'] as $i => $name )
                {
                    $pathinfo = pathinfo($name);

                    // if file not uploaded then skip it
                        if ( !is_uploaded_file($_FILES['files']['tmp_name'][$i]) )
                        continue;

                    // now we can move the uploaded files
                    // IMAGES
                    if (in_array($pathinfo['extension'], $images_ext)) {

                    if ( move_uploaded_file($_FILES['files']['tmp_name'][$i], $images . $name) )
                    {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#00FF00">successfully uploaded</font><br />';
                    } else {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">not successfully uploaded</font><br />';
                    }
                    // FILES
                    } else if (in_array($pathinfo['extension'], $files_ext)) {

                    if ( move_uploaded_file($_FILES['files']['tmp_name'][$i], $files . $name) )
                    {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#00FF00">successfully uploaded</font><br />';
                    } else {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">not successfully uploaded</font><br />';
                    }
                    // VIDEOS
                    } else if (in_array($pathinfo['extension'], $video_ext)) {

                    if ( move_uploaded_file($_FILES['files']['tmp_name'][$i], $video . $name) )
                    {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#00FF00">successfully uploaded</font><br />';
                    } else {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">not successfully uploaded</font><br />';
                    }                   
                    // MEDIA
                    } else if (in_array($pathinfo['extension'], $media_ext)) {

                    if ( move_uploaded_file($_FILES['files']['tmp_name'][$i], $media . $name) )
                    {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#00FF00">successfully uploaded</font><br />';
                    } else {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">not successfully uploaded</font><br />';
                    }
                    } else {
                        $msg .= '<b>File ' .($i+1). ':</b> ' . $name . '&nbsp; (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">has an unsupported ending</font><br />';
                    }
                }
            }
$tpl->set_ar_out(array('msg' => $msg), 0);
?>

The upload is working as the files are being put in their folders and also comes up with the message "Upload successful" but it includes my website layout again as if I would have an "include()" function running.

I am greatful for any help I could get on this.

  • 写回答

2条回答 默认 最新

  • dongwu5318 2014-10-31 16:32
    关注

    The solutions for this issue could be 2:

    1- Modify the target page (upload.php) to only print the data that you need.

    2- In your ajax function filter "xhr.responseText" to display just the data that you want

    I would decide myself for the 1st option doing an echo of variable msg in upload.php. Then on the success ajax you could try "status.html(data)" if "status.html(xhr.responseText)" still retrieves the whole page.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥60 版本过低apk如何修改可以兼容新的安卓系统
  • ¥25 由IPR导致的DRIVER_POWER_STATE_FAILURE蓝屏
  • ¥50 有数据,怎么建立模型求影响全要素生产率的因素
  • ¥50 有数据,怎么用matlab求全要素生产率
  • ¥15 TI的insta-spin例程
  • ¥15 完成下列问题完成下列问题
  • ¥15 C#算法问题, 不知道怎么处理这个数据的转换
  • ¥15 YoloV5 第三方库的版本对照问题
  • ¥15 请完成下列相关问题!
  • ¥15 drone 推送镜像时候 purge: true 推送完毕后没有删除对应的镜像,手动拷贝到服务器执行结果正确在样才能让指令自动执行成功删除对应镜像,如何解决?