обязательный атрибут textarea не работает, даже если значение пусто

Я создал простую страницу со списком и текстовой областью с условиями, которые должны быть обязательными.

Окно списка работает нормально, но поле textarea не сообщает, что поле необходимо заполнить.

<!DOCTYPE html>
<html>
<head>
<title>Ratings & Reviews</title>
<body>
<form>

<span>Customer Service*</span>
<span>
    <select name=customer id=aa required>
        <option selected="rate" value="" disabled>rate</option>
        <option value=1>1</option>
        <option value=2>2</option>
        <option value=3>3</option>
        <option value=4>4</option>
        <option value=5>5</option>
    </select>
</span>
<br><br>
<span>Value for money*</span>
<span>
    <select name=money id=aa required>
        <option selected="rate" value="" disabled>rate</option>
        <option value=1>1</option>
        <option value=2>2</option>
        <option value=3>3</option>
        <option value=4>4</option>
        <option value=5>5</option>
    </select>
</span>

<div>
    <textarea name="reviews" rows=11 cols=50 maxlength=250 required>
    </textarea>
</div>

<div id=submit>
    <br>
    <input type=submit name=submit value=submit>
</div>

</form>
</body>
</html>

html textarea required
person divakar.scm    schedule 12.06.2013    source источник

Ответы (8)


arrow_upward
78
arrow_downward

У вас есть пустое место внутри текстовой области, удалите его:

 <textarea name="reviews" rows=11 cols=50 maxlength=250 required ></textarea>

демонстрация скрипта

person sinisake    schedule 12.06.2013

arrow_upward
14
arrow_downward

Проблема в пробелах между тегами. Вы не должны давать пробелы в html между этими тегами, иначе браузер будет считать это значением.

person Siddharth Nagar    schedule 12.06.2013

arrow_upward
3
arrow_downward

попробуй это

<textarea name="mm" id="mm" rows="5" placeholder="NA if not applicable" required="required"></textarea>
person Mayur Morey    schedule 24.09.2015
comment
Неправильно. Атрибут required является логическим значением. Если он существует, потребуется заполнить textarea. Следовательно, поведение required равно required="required" - person Raptor; 14.04.2016
comment
Правильный. Цитата из спецификаций W3C и Whatwg: если атрибут присутствует, его значение должно быть либо пустой строкой, либо значением, нечувствительным к регистру ASCII, соответствующим каноническому имени атрибута, без пробелов в начале или конце. w3.org/TR/html5/infrastructure.html#boolean-attributes html.spec.whatwg.org/multipage/ w3.org/TR/html51/infrastructure.html#sec -boolean-attributes Однако значение атрибута не требуется. - person hmundt; 23.06.2016
comment
Правильные и некоторые динамически созданные html-требования обязательны = обязательны - person user3012857; 21.03.2017

arrow_upward
3
arrow_downward

И, вероятно, форма имеет атрибут novalidate. Любые атрибуты проверки элемента формы (например, required или regexp) с формой атрибут novalidate будут игнорироваться. .

person Alexander Goncharov    schedule 02.09.2017

arrow_upward
2
arrow_downward

Проверьте значение по умолчанию в текстовом поле. Должны быть пробелы, которые считаются значением.

person code_poetry    schedule 25.06.2019

arrow_upward
2
arrow_downward

Я столкнулся с подобной проблемой. Я оставил пробел между открывающим и закрывающим тегом Textarea, как в следующем коде.

<label><b>Register As:*</b></label>
<select name="category" id="category" class="form-control"  
 onchange="toggleInput()" required>
      <option value=''>--Select--</option>
      <option value='Attendee'>Attendee</option>
      <option value='Presenter'>Presenter</option>
</select>

 ...
<textarea name="description" id="description" class="form-control" 
placeholder="Explain here what you will present...">  </textarea>

и в моем javascript я пытался следовать

<script>
   function toggleInput() {  
      if( document.getElementById("category").value=="Attendee"){  
        document.getElementById("description").required = false;
      }
      else{
        document.getElementById("description").required = true;
      }
   }//End Function
</script>

И я не мог понять, в чем проблема, пока не попал на эту страницу. Это было пространство. Спасибо @sinisake за решение. Надеюсь, что мой опыт поможет кому-то

person tim3in    schedule 05.07.2019

arrow_upward
0
arrow_downward

Не используйте пробелы между открывающим и закрывающим тегами.

Например:

<textarea required>**Don't put any space here**</textarea>

Это будет работать нормально.

person Shubham Sharma    schedule 27.03.2021

arrow_upward
-1
arrow_downward

Я так долго застревал на этом, и оказалось, что это был пробел после ›. слава богу за знание наших предков

person J. Nikolai Tamayo    schedule 09.01.2021