onSubmit покажи DIV при запуске скрипта php

Question

onSubmit покажи DIV при запуске скрипта php

0

У меня простая форма:

<form id="uploadform" action="" method="post" enctype="multipart/form-data">
<input type="file" class="file_up" name="Filedata[]" />
<input type="submit" id="send" name="uploadenFormSend" value="Bestand(en) uploaden" class="button-pink">        
</form>

Когда форма отправляется, запускается скрипт php на той же странице. (нет JS или JQuery) Мне нравится делать следующее:

Когда запускается php-скрипт, должен быть показан DIV с идентификатором "прогресс". В конце op скрипт php он должен скрывать DIV.

Могу ли я сделать это с помощью JS или jQuery?

Я стараюсь:

В верхней части скрипта PHP:

echo '<script>
        document.getElementById("uploadStatus").style.display = "";
    </script>';

В конце скрипта php:

echo '<script>
        document.getElementById("uploadStatus").style.display = "none";
    </script>';

К сожалению, это не работает. Может кто-нибудь мне помочь?

Rick A. 17 дек. 2013, в 00:23

Источник

0

Так вы пытаетесь показать загрузчик, пока страница не загрузится?
Ahmed Sagarwala 16 дек. 2013, в 22:38
0

Если бы у вас не было много информации для отправки пользователю (я говорю о страницах и страницах информации), я бы не стал этого делать. Просто позвольте странице загружаться естественно и покончите с этим. С тем, как вы отправляете HTML-код клиенту, вы никогда не увидите, что это произойдет в любом случае. Вам нужно будет принудительно отправить частичную информацию клиенту, чтобы это имело какой-либо эффект.
Justin Wood 16 дек. 2013, в 22:40

Теги:

php

javascript

jquery

html

css

3 ответа

Ещё вопросы

Так вы пытаетесь показать загрузчик, пока страница не загрузится?
Если бы у вас не было много информации для отправки пользователю (я говорю о страницах и страницах информации), я бы не стал этого делать. Просто позвольте странице загружаться естественно и покончите с этим. С тем, как вы отправляете HTML-код клиенту, вы никогда не увидите, что это произойдет в любом случае. Вам нужно будет принудительно отправить частичную информацию клиенту, чтобы это имело какой-либо эффект.

leaf · Answer 1 · 2013-12-16T21-16-00.000Z

Я думаю, вы хотите отправить без перезагрузки страницы. В случае, если я прав, вы можете использовать Ajax. Вот возможное решение с помощью jQuery (еще не проверено):

<script>
$(function () {
    $('form').submit(function (e) {
        e.preventDefault(); // prevent page reload
        $('#uploadStatus').show();
        $.post(
            $(this).attr('action'), 
            $(this).serialize(),
            function () {
                $('#uploadStatus').hide();
            }
        );
    });
});
</script>

PHP-скрипт, который извлекает данные, должен быть в отдельном файле, например:

<form action="path/to/submit.php" ...

http://api.jquery.com/jQuery.post/

Jessie Green · Answer 2 · 2013-12-16T20-59-00.000Z

Самое важное, что вам нужно иметь в виду, это то, что PHP - это серверная сторона, а javascript/JQuery - клиентская. Весь PHP-код работает до того, как он достигнет вашего браузера. Javascript/JQuery все работает в вашем браузере. Когда вы используете кнопку отправки, вы отправляете запрос на сервер для новой страницы.

С учетом сказанного у вас есть 2 варианта:

Просто покажите свой прогресс div на submit:

$( document ).ready(function() {
  $('form').submit(function (e) {
    $('#uploadStatus').show();
  });
});

Это покажет индикатор выполнения, ожидая, пока сервер завершит запрос и вернет его для новой загрузки страницы.

Или вы можете сделать запрос ajax, как указано в @wared, который может быть или не быть больше, чем вы хотите получить.

В любом случае ваш прогресс div должен иметь стиль = "display: none" для начала.

Ahmed Sagarwala · Answer 3 · 2013-12-16T19-42-00.000Z

Использование jQuery:

$( document ).ready(function() {
  $("#uploadStatus").hide()
});

Просто убедитесь, что у вас есть ID, видимый по умолчанию.