All geek questions in one place

Manage a custom text field

I have a definite need to control how any text is entered in a multi-line text field (ASP: TextBox)

At first I, although I could only control it using JavaScript, but it seems that I can get closer, but not 100% of what I need.

Now I'm wondering if I need to write a control from scratch (I never did this), or if I can inherit from a TextBox and be able to get what I need.

Requirements:

  • MultiLine TextBox
  • Ability to manage rows and columns
  • Prefers to disable the scroll bar, which is disabled in the MultiLine text box.
  • Validators can still be used.
  • Word wrap
  • MAXLENGTH
  • If I set the columns to 26 and the rows to 4, the user should not have to enter more than 104 characters to enter (Here are the parts that I did not understand the output)
  • The user cannot enter more than four lines, even if the maximum length has not reached.

The linear limit was indeed the biggest part of my problem.

If you enter:

a
b
from
d

I can check how many characters \n . However, if you enter:

+12345678901234567890123456
7890
from
d

Here they are wrapped so that there is one \n character or you enter:

This is a long piece of typed text.
from
d

The text is complete here, and you cannot just count the \n characters.

+6
source share
1 answer
  • Divide the string by '\ n' into an array.
  • Calculate the length divided by 26 (round down and then add 1) for each element of the array
  • Sum these numbers (save as totals) (but subtract 1, because the algorithm counts one too many lines because of the last record)
  • Take the last length of the element of the mod 26 array. (Save as len1)
  • The number of characters left to enter = 104 - ((total * 26) + len1)

I can come up with some kind of javascript for you, but you want to display an error message, crop text or prevent text from being entered (what do you do in cut + paste?)

Page example:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Untitled Page</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" language="javascript" type="text/javascript"></script> </head> <body> <script language="javascript" type="text/javascript"> function validateTextArea(text) { var myText = text.val(); var myArray = text.val().split("\n"); var rowcount = myArray.length; for (i = 0; i < myArray.length; i++) { rowcount += myArray[i].length / 26; } rowcount -= 1; var len1 = myArray[myArray.length - 1].length % 26; var charsleft = 104 - ((rowcount * 26) + len1); if (charsleft < 0) alert("TOO LONG!"); } </script> <textarea rows="4" cols="26" id="txt"></textarea> <button onclick='validateTextArea($("#txt"))'>Do Validate</button> </body> </html>
+1
source

Source: https://habr.com/ru/post/890714/

More articles:


All Articles