Put text in textarea in specific way - html

Im using VS and created html page with textarea, I need to put the text in two rows from the start one above one like
row1:mytext
row2:mytext2
in order to make it work I should put it exactly like following and If I doing formatting to the page the text was removed from where I want it to be, there is a way to put the text in specific position in text area?
<div>
<textarea rows="2" cols="700" disabled="disabled" class="path-width">Expire: #ViewBag.CertExpireDate
Subject: #ViewBag.Cert</textarea>
</div>

Try this;
<textarea rows="2" cols="700" disabled="disabled" class="path-width">Expire: #ViewBag.CertExpireDate#(Environment.NewLine)Subject: #ViewBag.Cert</textarea>
#(Environment.NewLine) will add new line and it will bot be removed when you do the formatting.

Add
ancii code between line. Demo
<textarea rows="2" cols="700" disabled="disabled">
Expire: #ViewBag.CertExpireDate
Subject: #ViewBag.Cert
</textarea>
UPDATED
You can remove whitespaces using jquery trim(). Example
var text = $('textarea').val().trim();
$('textarea').html(text);

It works for me.
<textarea rows="2" cols="700" disabled="disabled" class="path-width">
Expire: #ViewBag.CertExpireDate
Subject: #ViewBag.Cert
</textarea>
Maybe the css class
class="path-width"
causes this problem. Check http://jsfiddle.net/7SqHc/

Related

How Do I Do a Read-Only Area On A Textarea In HTML?

I am trying to create a textarea where it shows text but when you click on it and write something the text disappears. For example, on some websites is says "Search" on the textbar and when you click it and write something, the text disappears (like Google). Here is the code that i wrote:
<textarea style="resize:none;" cols="35" rows="1" wrap="virtual">Search</textarea>
Sadly this code didnt work. It just writes some text on the textarea and it doesn't create a read-only text. I did my research and i couldn't find a question with a answer to my question. They were either not about HTML or they were about other things and not read-only. So can someone please help me with this? Thank you for your time. Have a wonderful day.
You can use the placeholder attribute.
<textarea style="resize:none;" cols="35" rows="1" wrap="virtual" placeholder="Search"></textarea>
You can use the placeholder attribute for that:
<textarea style="resize:none;" cols="35" rows="1" placeholder="Type something..." wrap="virtual"></textarea>

In html textarea tag automatic takes 4 spaces

When click middle position of the HTML textarea tag , it automatic takes 4 space. I want,dont take any space in textarea.
<textarea rows="2" cols="40" name="chief_complaints" class="form-control" value="">
</textarea>
How to solve this problem?
According to the standard, the textarea element does not support the value attribute, instead of that everything between <textarea> and </textarea> belongs to the value of the text area. To get rid of any spaces and newlines you have to write <textarea></textarea> without anything between the start and the end tag.
<textarea>[DON NOT USE BREAK LINES AND SPACES HERE, LET IT BE BLANK]</textarea>
For example:
<textarea rows="2" cols="10">Your Content</textarea>

Form input textarea vertical-align not working

I'm struggling to get inputted text to align with the top of an input textarea, on an HTML form, and have searched forums extensively, so I thought I'd post here.
I've tried using:
textarea{
vertical-align:top;}
and
input["textarea"]{
vertical-align:top;}
I've also tried adding autoflow:auto;
I think you are wanting to use a <textarea> instead of an <input>. Here's some background for you too, but you use different form elements for different things.
HTML
<input type="text" placeholder="input" value="input">
<br />
<textarea rows="10">Textarea that has text aligned to the top. No css needed</textarea>
Demo Here
Im not sure what your issue is but I will try and give an answer to what I believe is your problem :)
When you do like this:
<form>
<textarea cols="25" rows="5" required>
</textarea>
</form>
The spaces between your textarea is already rendered when you run the code - this means that when you wanna type in the textarea there is 100 different places you can begin texting.
I think what you wanna do is this:
<form>
<textarea cols="25" rows="5" required></textarea>
</form>
This way the texting in the textarea will begin in the top-left corner of the textarea, that is because you have not rendered any lines when you run this code.
DEMO of the two Versions:
http://jsfiddle.net/2thMQ/4/

Cursor in the middle of a textarea box?

In a very simple HTML form I've created, I've asked the user to provide additional details and have coded this section as:
<textarea rows="1" cols="50" wrap="physical" name="comments">
</textarea>
Any idea why the cursor starts off at the middle of this box? Well, it's not directly at the middle, but it's definitely not at the start (top left) corner of the box. I see a lot of solutions here and they all require Javascript to correct this. Is there a way to do this with just html?
What happens when you change it to:
<textarea rows="1" cols="50" wrap="physical" name="comments"></textarea>
I think it's not starting at the beginning because you've got whitespace inside the tag.
The reason that this happens is because you have white space in between the <textarea> tag. Try this
<textarea rows="1" cols="50" wrap="physical" name="comments"></textarea>
That generally happens when we enter a space between two opening and closing "textarea" tag for readibility.
i.e your opening <textarea> tag and Closing </textarea> tags are on different lines or there are some white spaces between them.
That does sound strange. Have you looked in firebug to see what CSS effects it? The only thing that comes to mind is that it's under the influence of text-align: center

Textarea css not clickable

How to set the css of a textarea not to be clicked on it.
<textarea></textarea>
Thanks
Try
<textarea disabled="yes"></textarea>
In most browsers, this will grey out the content of the textarea though, and the user won't be able to copy any text from within it. If you don't like that, you can use:
<textarea readonly="yes"></textarea>
The textarea will then remain clickable, and the user will still be able to select/copy text within it, but he won't be able to edit it.
So you don't want the user to edit the contents of the textarea? Simple solution: Don't use textarea. Just use a normal div or pre and style it.
You Cant do this with CSS, you have to do it in the markup like so:
<textarea disabled="disabled"></textarea>
If you care to be By-The-Book & standard compliant it is as follows :
For "Unclickable"
<textarea readonly>
...
</textarea>
For "Grayed & unclickable" aka Disabled :
<textarea disabled>
...
</textarea>
You can find all other properties of "textarea" here.