Базовый jquery и PHP session.upload_progress.name

0

Я пытаюсь получить прогресс файла, работая с новой функцией session.upload_progress.name в PHP 5.4.

Пока мой код таков:

<?
    session_start();
?>
<!DOCTYPE html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type='text/javascript'>

$(document).ready(function () {
    $("#jimbo").submit(function () {
        setInterval(function() {
            $.ajax({
                url: "ajx.php",
                success: function (data) {
                    $("#feedback").html(data + Math.random(999));
                }
            });
            //$("#feedback").html("hello " + Math.random(999));
        },500);
        //return false;
    });
});

</script>
</head>
<body>


<h1><a href="test.php">Upload</a></h1>
<br/>
<form action="test.php" method="POST" enctype="multipart/form-data" id='jimbo'>
   <input type="hidden" name="<?=ini_get('session.upload_progress.name'); ?>" value="myupload" />
   <input type="file" name="file1" />
   <input type="submit" id='submitme' />
</form>

<div id="feedback">Hello</div>

</body>
</html>

А затем файл ajx.php:

<? session_start(); ?>
<pre>
<?
    echo "SESSIONVAR<br/>";
    var_dump($_SESSION);
?>
</pre>

Теперь. Когда я нажимаю кнопку отправки (после выбора файла), файл начинает загружаться, но setinterval не запускается. Однако, если у меня есть return false; там я получаю результаты setInterval, но файл не запускается. Если я отправлю файл без возврата false, и в отдельном окне просмотрите содержимое ajx.php, я вижу, что переменная работает нормально и обновляется. Итак, как мне получить div #feedback для обновления после нажатия на форму?

обратите внимание, что массив сеанса заселен, здесь проблема с JQuery и ничего другого.

  • 0
    Задумывались ли вы об использовании объекта javascripts 'XmlHTTPRequest' для этого?
  • 0
    @ReinderWit да, он использует и запрос Ajax: $.ajax
Показать ещё 4 комментария
Теги:

1 ответ

0

Вы можете добиться аналогичной функциональности, используя свойство upload upload объектов XMLHttpRequest. У него есть несколько событий, в которые вы можете зацепиться, "прогресс" - один из них.

здесь образец, который я использовал. Он добавит строку с прогрессией (в%) в <div class="progression"> для каждого файла из поля <input type="file">:

function startUpload() {
    var fileInput = document.getElementById("file1");

    $('.progression').show();
    for(var i = 0;i<fileInput.files.length;i++) {
        doFileUpload(fileInput.files[i]);
    }
}

function doFileUpload(file) {
    var xhr = new XMLHttpRequest();

    var data = new FormData();
    var $progress = $('<div class=\"progress\"><p>' + file.name + ':</p><span>0</span>%</div>');
    $('div.progression').append($progress);
    data.append("file", file);
    data.append("album", $("#album").val());

    xhr.upload.onprogress = function(e) {
        var percentComplete = (e.loaded / e.total) * 100;
        $progress.find('span').text(Math.ceil(percentComplete));
    };

    xhr.onload = function() {
    if (xhr.status == 200) {
        var result = JSON.parse(xhr.responseText);
        if(result.success == "true") {
             console.log("Great success!");
        }
        else {
            console.log("Error! Upload failed");
        }
    };

    xhr.onerror = function() {
        console.log("Error! Upload failed.");
    };

    xhr.open("POST", "/_admin/_inc/upload.php", true);
    xhr.send(data);
}
Поделиться
  • 0
    @AdrianPreuss Нет , это не так. Пожалуйста, внимательно прочитайте мой вопрос, прежде чем делать выводы.
  • 0
    @ Chud37 посмотрите на страницы разработчиков Mozilla: developer.mozilla.org/nl/docs/Web/API/XMLHttpRequest/… , есть много интересных вещей, которые вы можете использовать ...
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню