0

Here is what I have: I have a textArea that has very strict size limitations, height: 300px, width: 612px, these are fixed and cannot change.

Here is what I need it to limit: I need the text entered to be able to fit on one page, I have done research on the page that it needs to fit on to and the limit is 101 lines with a max of 118 chars per line. And show the user how much they have left.

Issue: All of the solutions that I have found use the textarea itself and the size of it to dynamically display the number of lines and chars left. However since this is fixed height, the initial rows is thrown off by using that method. Also when enter is pressed I haven't found a good way to decrease the number of chars they then have left.

NeArcher
  • 3
  • 4
  • What about if a user changes their font size or has a custom user style sheet with a different font size, or has a device with a different DPI? There's only that many lines/characters at the specific font-size, resolution, and DPI that you're testing with. If you want a hard limit of characters, then you can do that, but trying to make it fit within the textbox is impossible to do with consistency. – Chris Pratt Sep 08 '14 at 16:26
  • This is possible with js, change your question tag to JavaScript or jquery. And keep in mind that you must check it in server side too, because it's easy for end users to change limit logics in there browser. this also might be useful: http://stackoverflow.com/questions/6501043/limit-number-of-lines-in-textarea-and-display-line-count-using-jquery – Masoud Sep 08 '14 at 17:12
  • @ChrisPratt The end font and font size is set, all i need from the user is their entry to be under the max limit. – NeArcher Sep 08 '14 at 17:50
  • @Masoud That would work except for limiting the number of chars per line as well. How would I add that detail in there? (Ex. If they typed 120 chars then hit enter, they would actually be on the 3rd line) – NeArcher Sep 08 '14 at 17:53
  • You cant "set" the font or font size. A user can override any and every style on your page. Additionally if you're designing correctly, your font size is going to be relative to the user's font, so if they're in HiDPI, text will be larger than you anticipate. There's also mobile to consider where there's countless DPI values and default font sizes. – Chris Pratt Sep 08 '14 at 17:55
  • @ChrisPratt by set, I mean that I don't care how they manipulate or modify their settings, once they submit the form all I take is the text and output it to my page. I know that they can modify their style which is why I am not sure what the best solution to my issue is. – NeArcher Sep 08 '14 at 18:01
  • My point was that the only solution is to set a hard limit on the characters for the textarea overall (`maxlength` with appropriate server-side validation). Anything else is beyond your control. – Chris Pratt Sep 08 '14 at 18:05

0 Answers0