Custom Text Box control
I have a specific need to control how some text is entered in a multiline textbox (ASP:TextBox)
At first I though I could control it with just JavaScript but it appears I can get close but not 100% of what I need.
Now I'm wondering if I need to write a control from scratch (never done that) or if I can inherit from TextBox and be able to get what I need.
Requirements:
- MultiLine TextBox
- Ability to control row's and columns
- Would prefer to be able to turn off the scroll bar that appears disabled on a MultiLine Textbox
- St开发者_如何学JAVAill be able to use the validators
- Word Wrap
- Maxlength
- If I set the columns to 26 and the rows to 4 the user should not be able to enter more then 104 characters (Here comes the parts I've not figured out)
- The user can not enter more then 4 lines even if the max length is not reached.
The 4 line limit has really been the biggest part of my trouble.
If you enter:
a
b c d
I can check how many \n characters. However if you enter:
12345678901234567890123456
7890 c d
Here they have wrapped so there is one less \n character or you enter:
This is a long piece of
text that has been entered c d
Here the text has wored wrapped and again you can't just count the \n characters.
- Split the string by '\n' into an array.
- Calculate the length divided by 26 (round down and then add 1) for each array member
- Sum these figures (store as total) (but subtract 1 because the algorithm counts one too many lines due to the last entry)
- Take the last array member length mod 26. (store as len1)
- Number of chars left to type = 104 - ((total*26) + len1)
I can come up with some javascript for you if you wish, but are you wanting to display an error message, trim the text, or prevent typing (what are you doing about cut+paste?)
Example Page:
<!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>
加载中,请稍侯......
精彩评论