Reputation: 14997
How can I apply style and javascript to a textarea field to get it to act like an input textfield?
I have some input textfields that I want to capture pastes with newline characters. To achieve this I converted the input textfields to textareas. It would be nice however if the textarea input looked and acted like a input field.
I've determined how to size the textarea to look like an input, but there are other subtle differences all of which I haven't inventoried. I'm looking for a library or comprehensive way to have textarea act like textfield.
Thank you
Update
I'm going to leave the text fields alone. It turns out I can just create a hidden textarea and switch focus to that element on paste events to grab multiline pasted data.
Upvotes: 2
Views: 2481
Reputation: 14997
So far I've found the follow style html and css useful.
textarea {
overflow: hidden;
resize: none;
}
<textarea rows=1 wrap=Off></textarea>
Upvotes: 2
Reputation: 76910
You could do:
textarea{
width: 10em;
height:1.2em;
}
for the style
Upvotes: -1
Reputation: 6618
To get it to look like an input field you'd need to change the length
and width
of it to be the proper size. Other than that the two look rather similar. As for the JavaScript, it would be similar to what you're already using for the inputs
.
Upvotes: 1