@ReactDev

Как использовать enctype="multipart/form-data" что бы он не мешал другим input?

Всем привет! Начал изучать Node.js все шло хорошо, но тут столкнулся с проблемой передачи файлов на сервер. Не могу понять как правильно это сделать в одном теге .

Я пытаюсь сохранить файлы в папке и передать на сервер данные с селектов и инпутов на сервер. Отдельно передать инпуты и селекты получается и отдельно файлы сохранить в папке получается,но все вместе не работает =(

Добрые люди помогите,пожалуйста

<!DOCTYPE html>
<html lang="en">
  <%- include('./partials/head.ejs')%>
<body>
  <%- include('./partials/nav.ejs')%>
  <div>
  <form id="contact-form" method="post" enctype="application/x-www-form-urlencoded">
    <div class="form-info">
      <label>Заголовок товара
        <input type="text" name="title">
      </label>
      <label>Автор
        <input type="text" name="author">
      </label>
    </div>
    <label> Категория: 
    <select name="selectсategory">
      <option >selectсategory1</option>
      <option >selectсategory2</option>
      <option >selectсategory3</option>
      <option >selectсategory4</option>
    </select>
  </label>
  <label> Наличие: 
    <select name="availability">
      <option >availability1</option>
      <option >availability2</option>
      <option >availability3</option>
    </select>
  </label>
  <div class="form_label">
    <span class="form_text">Размеры:</span>
    <div class="multiselect_block">
      <label for="select-1" class="field_multiselect">Размеры:</label>
      <input id="checkbox-1" class="multiselect_checkbox" type="checkbox">
      <label for="checkbox-1" class="multiselect_label"></label>
      <select id="select-1" class="field_select" name="size" multiple style="@media (min-width: 768px) { height: calc(4 * 38px)}">
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        <option>5</option>
        <option>6</option>
        <option>7</option>
      </select>
    </div>
    <label> Выбор бренда
      <select name="brand">
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        <option>5</option>
        <option>6</option>
      </select>
    </label>
    <span class="error_text"></span>
</div>

    <div class="form-text">
      <label>Описание товара
        <textarea name="text"></textarea>
      </label>
    </div>
    <div>
      <span>Цена:</span> <input type="number" name="price" value="0.00">
      
    </div>
    <form id="contact-image-form" method="post" enctype="multipart/form-data">
      <div class="container ">
        <div class="row">
          <div class="col-md-12">
            <div class="uploadOuter">
            <span class="dragBox">
              <input type="file" 
              name="uploudInput"
              multiple 
              onChange="dragNdrop(event)"
              ondragover="drag()"
              ondrop="drop()" 
              id="uploadFile" 
              >
            </span>
            </div>
            <div id="preview"></div>
          </div>
        </div>
      </div>
      </form>
  </form>
 
    <div class="form-button">
      <input type="submit" value="Отправить" formaction="/add-post" onclick="submitForms()">
    </div>
  </div>
  <script src="/draganddrop.js"></script>
  <script src="/multiselector.js"></script>
  <script>
  submitForms = function(){
    document.getElementById("contact-form").submit();
    document.getElementById("contact-image-form").submit();
  }
  </script>
</body>
</html>
  • Вопрос задан
  • 44 просмотра
Решения вопроса 1
ThunderCat
@ThunderCat Куратор тега HTML
{PHP, MySql, HTML, JS, CSS} developer
ReactDev,
я пробывал разные варианты, пожалуйста, не судите строго
в истории вопросов вижу у вас вопросы по реакту и жс, и по этому слегка странно видеть такой гигантский провал в знаниях по банальной хтмл разметке...
В принципе все косяки я вам перечислил в первом комментарии. Яваскрипт убрать, форму (одну!, там не нужно 2 формы) привести в порядок, кнопку вернуть на законное место, прочитать про формы с файлом любой толковый онлайн ресурс для общего развития.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Рулю Екатеринбург
от 110 000 до 120 000 ₽
от 150 000 до 200 000 ₽
Gradient Москва
от 180 000 ₽
30 нояб. 2022, в 00:04
1000 руб./за проект
29 нояб. 2022, в 23:48
300 руб./за проект