динамически созданный элемент ввода HTML-файла не публикует данные - PullRequest
4 голосов
/ 30 июня 2011

У меня есть форма, которая динамически создается с использованием document.createElement.Компоненты создаются таким же образом.Форма используется для загрузки файла в сценарий PHP и при отправке загружает ответ в iframe, указанном целевым атрибутом формы.

К сожалению, сервер получает пустой массив $ _FILES, и когда япроверить запрос POST я вижу, что данные файла не были включены в запрос.Если я вместо этого на лету использую инструменты разработчика Google Chrome для редактирования динамически созданной формы (в этом процессе я просто РЕДАКТИРУЮ, а затем совершенно не изменяю код), представления формы после этого работают отлично, отправляя соответствующие данные файла.

Так что это заставляет меня понять, что нет ничего плохого в построении моей формы в html, потому что она работала без каких-либо изменений.Что заставляет меня верить, что браузер не любит, когда я динамически создаю элементы ввода файлов?

Для полноты, вот динамически сгенерированная форма:

<form method="POST" action="includes/uploadPic.php" 
      enctype="multipart/form-data" target="fileResponse">
  <input type="file" name="pic">
  <input type="submit" value="Upload">
</form> 

И print_r($_FILES) дает пустой массив на сервере.

Может кто-нибудь объяснить этомне?Моя альтернатива состоит в том, чтобы статически создать скрытую форму в документе и просто добавить ее в соответствующий div, когда мне это нужно, но мне действительно не нравятся такие вещи.

Ниже приведен код, который генерирует форму:

    var form = document.createElement("form");
    var fileUpload  = document.createElement("input");
    var uploadBut   = document.createElement("input");

    form.setAttribute("method",  "POST");
    form.setAttribute("action",  "includes/uploadPic.php");
    form.setAttribute("enctype", "multipart/form-data");
    form.setAttribute("target",  "fileResponse");
    fileUpload.setAttribute("type",  "file");
    fileUpload.setAttribute("name",  "pic");
    uploadBut.setAttribute ("type",  "submit");
    uploadBut.setAttribute ("value", "Upload");
    form.appendChild(fileUpload);
    form.appendChild(uploadBut);
    dlgContent.appendChild(form);

Ответы [ 2 ]

0 голосов
/ 29 мая 2013

Если вы поместите тег form в тег div, он не будет публиковать динамически созданные элементы на сервере.Однако, если вы берете его за пределы тега div или table, он работает.

0 голосов
/ 13 июля 2011

попробуйте это:

var form = document.createElement("form");
var fileUpload  = document.createElement("input");
var uploadBut   = document.createElement("input");

form.method = "POST";
form.action = "includes/uploadPic.php";
form.enctype = "multipart/form-data";
form.target = "fileResponse"; /* I think you are trying to submit this from in an iframe */
fileUpload.type = "file";
fileUpload.name = "pic";
uploadBut.type = "submit";
uploadBut.value = "Upload";
form.appendChild(fileUpload);
form.appendChild(uploadBut);
dlgContent.appendChild(form);
...