0

Как очистить file в функции ValidateSize(), если он попадает под условие. Так как после вывода alert, file = выбранному объекту и при нажатии на (input type="submit") отправляется не валидный файл.

<form method="POST" enctype="multipart/form-data" action="http://localhost:9015/up">
  <div>
    <div>
      <label for="file">Upload</label>
      <input id="file" type="file" onchange="ValidateSize(this)" name="file" required="" />
      <script type="text/javascript">
        function ValidateSize(file) {
          var FileSize = file.files[0].size / 1024 / 1024;
          if (FileSize > 5) {
            alert('File size exceeds 5 MB');
          }
        }
      </script>
    </div>
    <div>
      <input type="submit" onchange="sent()" value="Send" name="submit" />
    </div>
  </div>
</form>

5
  • У JS очень ограниченный доступ к файловой системе. Не стоит надеяться на эту возможность...
    – DNS
    24 окт 2017 в 20:04
  • this.value = ''.
    – user207618
    24 окт 2017 в 20:10
  • Отправка запроса на REST сервис, не пойму как связано с ограничениями JS. Как реально обработать эту ситуацию? Я пишу Java , это мой первый опыт с JS и HTML.
    – L S
    24 окт 2017 в 20:12
  • разве this, в этот момент, указывает на file?
    – L S
    24 окт 2017 в 20:15
  • @LS, извините, проглядел. Конечно нет, вероятно на глобальный объект. Тогда file.value = ''.
    – user207618
    24 окт 2017 в 21:03

1 ответ 1

0

Реализовал скрытие кнопки до выбора валидного файла. Теперь запрос отправляется из тела функции и перенаправления по submit не происходит!

<div>
  <label for="file">Upload</label>

  <input id="file" type="file" onchange="ValidateSize(this)" accept="image/jpeg,image/jpg,image/png, text/plain, text/html, application/pdf,
					 .doc, .docx, .ppt, .pptx, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document" name="file" required="" />
  <script type="text/javascript">
    function ValidateSize(file) {
      var FileSize = file.files[0].size / 1024 / 1024; // in MB
      if (FileSize > 5) {
        document.getElementById('test_id').setAttribute('style', 'display: none');
      } else {
        document.getElementById('test_id').removeAttribute('style');
      }

      var xhr = new XMLHttpRequest();
      xhr.open('POST', 'http://localhost:9015/v');
      xhr.onload = function() {
        if (xhr.status === 200) {
          console.log('Something went wrong.  Name is now ' + xhr.responseText);
        } else if (xhr.status !== 200) {
          console.log('Request failed.  Returned status of ' + xhr.status);
        }
        console.log(xhr);
      };
      var form = document.getElementById('form_id');
      var formData = new FormData(form);
      xhr.send(formData);
    }
  </script>
</div>
<div id="test_id" style="display: none">
  <input type="submit" value="Send Resume" name="submit" />
</div>

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.