Menu
<div class="form-group">
<label for="user-message" class="col-lg-2 control-label">Message
</label>
<div class="col-lg-10">
<textarea name="user-message" id="user-message" class="form-control" cols="20" rows="10" placeholder="Enter your Message">
</textarea>
</div><!--end col 10-->
</div><!--ends from group-->
I am new to Bootstrap. I was trying to use placeholder in textarea.I was not able to see the Placeholervalues in my textarea.Please help me in this.
710
If you have an input in your form and placeholder is not showing because a white space at the beginning, this may be caused for you "value" attribute. In case you are using variables to fill the value of an input check that there are no white spaces between the commas and the variables.
The placeholder attribute of the <textarea> element is used to set a placeholder text in the textarea. A placeholder is considered as a hint, like “Enter you name”, “Enter mobile number”, “Write in 100 words”, etc. Above, text is the hint you want to set for the textarea as a placeholder text.
Placeholders can be used to enhance the experience of your application. They're built only with HTML and CSS, meaning you don't need any JavaScript to create them. You will, however, need some custom JavaScript to toggle their visibility.
Definition A Bootstrap Textarea is an input dedicated to a large volume of text. It may be used in a variety of components like forms, comment sections, chats and forums. Textarea can hold an unlimited number of characters, and the text renders in a fixed-width font.
You can add placeholder text to a textarea by using the HTML placeholder attribute; for example: <textarea placeholder="Describe yourself here..."></textarea> If you’re building an application that requires users to enter text, you’ll most likely be taking advantage of a rich text editor like TinyMCE.
The opening and closing tags for the <textarea> element must be on the same line, otherwise a newline character occupies it. The placeholder will therefore not be displayed since the input area contains content which is a newline. Show activity on this post. Thanks for contributing an answer to Stack Overflow!
A basic example of a simple textarea input. A Bootstrap Textarea is an input dedicated to a large volume of text. It may be used in a variety of components like forms, comment sections, chats and forums. Textarea can hold an unlimited number of characters, and the text renders in a fixed-width font.
Placeholder text is only shown when there is no content in the input component.
The <textarea> element you have is not empty - there is whitespace between the start and ending tags.
The fix is to remove this whitespace:
<div class="form-group">
<label for="user-message" class="col-lg-2 control-label">Message
</label>
<div class="col-lg-10">
<textarea name="user-message" id="user-message" class="form-control" cols="20" rows="10" placeholder="Enter your Message"></textarea>
</div><!--end col 10-->
</div><!--ends from group-->
The opening and closing tags for the <textarea> element must be on the same line, otherwise a newline character occupies it.
The placeholder will therefore not be displayed since the input area contains content which is a newline.
<div class="form-group">
<label for="user-message" class="col-lg-2 control-label">Message
</label>
<div class="col-lg-10">
<textarea name="user-message" id="user-message" class="form-control" cols="20" rows="10" placeholder="Enter your Message"></textarea>
</div><!--end col 10-->
</div><!--ends from group-->
JSFIDDLE
29
Use this code
<div class="form-group">
<label for="user-message" class="col-lg-2 control-label">Message
</label>
<div class="col-lg-10">
<textarea name="user-message" id="user-message" cols="20" rows="10" class="form-control" placeholder="Enter your Message"></textarea>
</div><!--end col 10-->
</div><!--ends from group-->If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
