Как сделать загрузку файла «Обязательным» в контактной форме 7?

Question

У меня есть форма контактной формы 7 на моем веб-сайте Wordpress, и я указал, что загрузка файла является обязательной, указав *, однако пользователи могут отправить форму без загрузки файла.

Соответствующая контактная форма 7 приведена ниже:

<div class="filelink">[file* AddanImage filetypes:gif|png|jpg|jpeg]</div>

Как мне написать код контактной формы 7 или добавить проверку, чтобы пользователи не могли отправить форму без загрузки изображения?

Любые советы / помощь / руководство высоко ценится.

Answer 1

Вы можете использовать JavaScript, чтобы проверить, существует ли значение файла.

const form = document.querySelector('form'),
      span = document.createElement("span"),
      text = document.createTextNode("Please upload a file: "),
      parent = document.getElementById("file").parentNode,
      file = document.getElementById('file');
      
form.addEventListener('submit', (e) => {
  if (file.value === '') {
    e.preventDefault();
    parent.insertBefore(span, file);
    span.appendChild(text);
  }
});

<form>
  <input type="file" name="file" id="file"><br>
  <input type="submit" value="Upload the file">
</form>