Включить и отключить кнопку загрузки в javascript - PullRequest
Новая
       23

Включить и отключить кнопку загрузки в javascript

1 голос
/ 03 мая 2020

Я сделал форму, которая запрашивает имя и адрес электронной почты, чтобы загрузить файл. Проблема в том, что кнопка «Загрузить» работает независимо от того, заполняете ли вы имя или нет, даже несмотря на то, что отображается сообщение о том, что отсутствует информация для загрузки файла.

Мне не хватает js знание, как найти способ заставить работать кнопку «Загрузить» при вводе имени и адреса электронной почты.

Может кто-нибудь помочь? Пожалуйста!

HTML Кнопка загрузки:

<button type="submit" onclick="window.location.href='download/CV.pdf'">Download</button>

JS: 

  var email = document.getElementById("email").value;
  var error_message = document.getElementById("error_message");

  error_message.style.padding = "10px";

  var text;
  if(name.length < 5){
    text = "Please Enter valid Name";
    error_message.innerHTML = text;
    return false;
  }
  if(email.indexOf("@") == -1 || email.length < 6){
    text = "Please Enter valid Email";
    error_message.innerHTML = text;
    return false;
  }
  alert("Thank you!");
  return true;
}

Спасибо!

1 Ответ

0 голосов
/ 03 мая 2020

Вы можете сделать это так. 

  <form onsubmit="return validateForm(event)">
    <button type="submit">Download</button>
    <input type="text" id="email" placeholder="Email">
    <input type="text" id="name" placeholder="Name">
  </form>

  ...

  function validateForm(event) {
    event.preventDefault();

    var email = document.getElementById("email").value;
    var name = document.getElementById("name").value;
    var error_message = document.getElementById("error_message");

    error_message.style.padding = "10px";

    var text;
    if(name.length < 5){
      text = "Please Enter valid Name";
      error_message.innerHTML = text;
      return;
    }
    if(email.indexOf("@") == -1 || email.length < 6){
      text = "Please Enter valid Email";
      error_message.innerHTML = text;
      return;
    }
    window.location.href = "download/CV.pdf";
  }
...