CODEWITHSUNDEEP
javascripthtmlcss
Simone Argento
Simone Argento

Reputation: 23

How to capitalize first letter of textarea HTML?

I am a newbie in web programming and I am looking for a way to capitalize just the first letter of a textarea. I've already tried this solution found on the web but it doesn't work.

.textarea_part::first-letter {
  text-transform: capitalize;
}
<p class="textarea_part">
  <textarea name="#" placeholder="La tua richiesta"></textarea>
</p>

How can I solve this problem?

Upvotes: 2

Views: 1096

Answers (1)

doo_doo_fart_man
doo_doo_fart_man

Reputation: 404

Using javascript:

document.querySelector('.textarea_text').addEventListener('input', () => {
  text = document.querySelector('.textarea_text').value;
  document.querySelector('.textarea_text').value = text.charAt(0).toUpperCase() + text.slice(1);
})
<p class="textarea_part">
    <textarea name="#" placeholder="La tua richiesta" class="textarea_text"></textarea>
</p>

Thanks, @marcus-parsons for informing me of the input event listener! It's much faster for the javascript method now.

Upvotes: 5

Related Questions