Создать несколько файлов загрузки динамически - PullRequest
Новая
       5

Создать несколько файлов загрузки динамически

2 голосов
/ 22 июня 2009

Мне было интересно, знает ли кто-нибудь лучший способ динамически создать форму загрузки?

Вот что я пытаюсь достичь: код, показанный ниже, позволяет одну загрузку, я хочу иметь кнопку, которая при нажатии должна добавить другую форму для загрузки файла. Итак, если я хочу загрузить - скажем, 7 файлов, я хочу нажать кнопку 7 раз, чтобы создать эти формы загрузки, каждый в своей строке.

Могу ли я это сделать в любом случае?

Спасибо за вашу помощь: 

<html>
    <head>
        <title> Multiple File Uploads </title>
    </head>
    <body>
        <form enctype="multipart/form-data" action="uploader.php" method="POST">
            Choose a file to upload: <input name="uploadedfile" type="file" /><br />
            <input type="submit" value="Upload File" />
        </form>
    </body>
</html>

Ответы [ 6 ]

3 голосов
/ 22 июня 2009

Обычно вы делаете что-то подобное, на стороне клиента: 

<div id='Uploadcontainer'>
   <input type='file' name='uploadfiles[]' class='uploadfile' />
</div>
<button id='extraUpload'>Add another field</button>
<script type='text/javascript'>
  $('#extraUpload').click(function(){
      $('.uploadfile:last').clone().appendTo('#uploadContainer');
  });
</script>

То есть использует jQuery. Затем на стороне сервера вы можете легко перебрать массив $ _FILES ['uploadfiles']: 

foreach($_FILES['uploadfiles'] as $file){
  //do stuff with $file
}
1 голос
/ 22 июня 2009

Вот действительно очень простой, работает в FireFox, Chrome и IE7. Я бы действительно посоветовал вам ознакомиться с фреймворком javascript, таким как jQuery, это облегчит вашу жизнь. 

<div id='Uploadcontainer'>
<input type='file' name='uploadfiles[]' class='uploadfile' />
</div>
<button id='extraUpload' onclick="return addAnother('Uploadcontainer')">Add another field</button>
<script type='text/javascript'>
function addAnother(hookID)
{
    var hook = document.getElementById(hookID);
    var el      =   document.createElement('input');
    el.className    =   'uploadfile';
    el.setAttribute('type','file');
    el.setAttribute('name','uploadfiles[]');
    hook.appendChild(el);
    return false;
}

1 голос
/ 22 июня 2009

jQuery имеет хороший плагин, который я использовал, который называется MultiFile. Вы можете проверить это.

http://www.fyneworks.com/jquery/multiple-file-upload/

1 голос
/ 22 июня 2009

посмотрите здесь простой пример

http://mohamedshaiful.googlepages.com/add_remove_form.htm

Josh

0 голосов
/ 22 июня 2009

В настоящее время нет способа сделать это с обычным HTML. Я думаю, что это начинает решаться в последних версиях браузеров и предстоящей спецификации HTML5.

Для большинства современных кросс-браузерных решений требуется библиотека JS (и я думаю, что Flash). Альтернативой является выбор каждого файла индивидуально со своим собственным элементом ввода. По понятным причинам браузеры реализуют очень строгую безопасность в отношении сценариев и отображения элементов загрузки файлов, что может затруднить их работу.

0 голосов
/ 22 июня 2009

Вы можете попробовать этот плагин jQuery под названием uploadify Вы можете попробовать YUI uploader

Просто убедитесь, что вы правильно обрабатываете файл на сервере, так как Flash иногда отправляет данные на сервер различными способами. Так что, если у вас есть какой-то способ проверить, что находится в значениях Request, тогда вам должно быть хорошо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...