Placeholder I do not understand what the problem is. 2 are identical. one is displayed the other is not. Why?

Question

HTML

page on node ejs

<% include header %>


<h2>Написать новую запись</h2>

<form method="post" role="form">
  <div class="form-group">
    <label for="title">Заголовок</label>
    <input type="text" class="form-control" id="title"
    name="title" placeholder="Введите заголовок" required>
    </div>

    <div class="form-group">
      <label for="content">Сообщение</label>
      <textarea class="form-control" id="body" name="body" placeholder="Обожаю Express. На нем круто делать сайты" 
        rows="3"  required>
      </textarea>
      <textarea class="form-control" id="body" name="body" placeholder="строка" rows="3" required>
</textarea>
      </div>

      <div class="form-group">
        <input type="submit" value="Отправить" class="btn btn-primary">
        </div>
        </form>

        <% include footer %>

Textarea 2 identical with id body The one that the id string is displayed, the other is not. Why is the other not displayed, what's the problem?

the second where "line" is written is added for an example. If you leave where "I love express" nothing is displayed, but the one where the string is the same and there the word "string" is displayed. What is the problem?

Answer 1

Remove spaces before closing </textarea>
The placeholder displays the text written between the opening and closing textarea tag. in your case it's multiple spaces.
Compare:

<textarea class="form-control" id="body" name="body" placeholder="Обожаю Express. На нем круто делать сайты" 
        rows="3"  required>Hello</textarea>

The placeholder will have hello

Answer 2

id must be unique, i.e. there can't be two elements with id='body'