Как я могу проверитьи <textarea></textarea> тег с использованием JavaScript - PullRequest
Новая
       0

Как я могу проверитьи <textarea></textarea> тег с использованием JavaScript

0 голосов
/ 22 сентября 2018

Когда я пытаюсь проверить название института и дату рождения в моей html-форме, используя javascript, это не работает, я много раз искал в google, но не смог найти решение своих запросов.Любой вид помощи приветствуется.

function validation() {
  var first_name = document.getElementById('Fname').value;
  var last_name = document.getElementById('Lname').value;

  var Institute_name = document.myForm.institute.value;
  var DOB = document.getElementById('dob').value;

  if (first_name == "") {
    document.getElementById('fname').innerHTML = "** Please fill this field";
    return false;
  }

  if ((last_name == "") && (first_name != "")) {
    document.getElementById('lname').innerHTML = "** Please fill this field";
    document.getElementById('fname').innerHTML = "";
    return false;
  }

  if ((Institute_name == '') && (last_name != "")) {
    document.getElementById('InstituteE').innerHTML = "** Please fill this field";
    document.getElementById('branchE').innerHTML = "";
    return false;
  }

  if (!DOB.value) {
    document.getElementById('DateOfBirth').innerHTML = "Please enter a valid birthday";
    return false;
  }
}
<body>
  <div id="container">
    <div id="wall">
      <form action="" name="myForm" onsubmit="return validation()" method="POST" class="bg-light">

        <h1 style="text-align: center; font-size: 52px; color: bisque"><u>INTERNSHIP FORM</u></h1><br><br>
        <p>FIRST &nbsp;NAME :&nbsp;&nbsp;&nbsp;<input type="text" id="Fname" placeholder="First Name......" autocomplete="off">
          <span id="fname" class="text-danger"></span> LAST &nbsp;NAME :&nbsp;&nbsp;&nbsp;<input type="text" id="Lname" placeholder="Last Name........" autocomplete="off">
          <span id="lname" class="text-danger"></span>
        </p>

        <p>
          NAME &nbsp;OF &nbsp;THE &nbsp;INSTITUTE :&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <br><br>
          <textarea name="institute" rows="3" cols="30" placeholder="Institute name...">
                            </textarea>
          <span id="InstituteE" class="text-danger"></span> DATE OF BIRTH :&nbsp;&nbsp;&nbsp;<input type="date" id="dob" autocomplete="off">
          <span id="DateOfBirth" class="text-danger"></span> </p>
        <p>
          <input type="submit" name="submit" value="SUBMIT" class="btn btn-success" style="padding: 20px; font-size: 28px;"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
          <input type="reset" name="reset" value="RESET" class="btn btn-primary" style="padding: 20px; font-size: 28px;">
        </p>

      </form>
      <br><br><br><br><br><br>
    </div>
  </div>

</body>
</code>

Здесь я использую тэг span, чтобы вывести ошибку незаполнения этого поля, и сделал этот тег class = "danger".

1 Ответ

0 голосов
/ 22 сентября 2018

Я обнаружил 2 проблемы, когда попробовал его с вашим кодом.

Текстовое поле: - ваше текстовое поле уже содержит пробелы после загрузки - поэтому, когда вы проверяете, пусто ли оно, оно найдет содержимое и, следовательно, "заполнено"

(Institute_name == '')

Поэтому я бы рекомендовал сначала удалить начальные и конечные пробелы, чтобы проверялся только «реальный контент» (метод js trim сделает это за вас) 

( Institute_name.trim() == '')

Дата: При доступе к полю даты 

var DOB = document.getElementById('dob').value;

вы уже получаете значение (например, 2018-09-22).Таким образом, двойной доступ к значению 

if(!DOB.value)

всегда будет иметь значение undefined / false.Так что просто проверьте переменную еще раз, например, на пустую строку 

if(DOB == '')

Кроме того, вы всегда можете проверить, является ли она верным введением даты (см. Обнаружение экземпляра даты «недопустимая дата» в JavaScript )

Кстати.Я бы порекомендовал заглянуть в Developer / Dev Tools вашего любимого браузера - он действительно помогает вам отлаживать js-код, проверять переменные и т. Д.: -)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...