473,397 Members | 1,950 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,397 software developers and data experts.

Textarea, maybe an other way

I have another question..
Let's take a textarea with the parameter: "rows=4"
(<textarea rows=4 onkeydown="CheckScrollbar()"> )

If you start typing the scrollbar at the right is not active. Only when you
exceed the four lines (rows=4) the scrollbar becomes active.
That moment..the moment the scrollbar becomes active..can javascript
recognize/capture this moment?
Thanks, Simon
Jul 20 '05 #1
4 5248
You can do that, try this example (tested on IE6):

<html>
<head>
<script type="text/javascript">
var savedValue="";
function CheckScrollbar(){
var nomoretext=false;
var str = document.getElementById("nomorethanxrows").value;
var lines = str.split("\n");
var allowedLines =
document.getElementById("nomorethanxrows").getAttr ibute("rows");
var allowedCols =
document.getElementById("nomorethanxrows").getAttr ibute("cols")
if (lines.length > allowedLines){
nomoretext=true
}
var howmanyrows=0;
for (var i = 0; i<lines.length; i++){
var onelinelength =
(i==lines.length-1)?lines[i].length:lines[i].length-1;
if (onelinelength > allowedCols)
howmanyrows += Math.ceil(onelinelength/allowedCols);
else
howmanyrows++;
if (howmanyrows > allowedLines)
nomoretext=true;
}
if (nomoretext){
alert("No more text in my house.");
document.getElementById("nomorethanxrows").value = savedValue;
}
}
function SaveValue(){
savedValue=document.getElementById("nomorethanxrow s").value;
}
</script>
</head>

<body>
<textarea id="nomorethanxrows" rows="4" cols="15" onkeypress="SaveValue()"
onkeyup="CheckScrollbar()"></textarea>
</body>
</html>

"Simon" <si*******@planet.nl> wrote in message
news:bf**********@reader10.wxs.nl...
I have another question..
Let's take a textarea with the parameter: "rows=4"
(<textarea rows=4 onkeydown="CheckScrollbar()"> )

If you start typing the scrollbar at the right is not active. Only when you exceed the four lines (rows=4) the scrollbar becomes active.
That moment..the moment the scrollbar becomes active..can javascript
recognize/capture this moment?
Thanks, Simon

Jul 20 '05 #2
Thanks a lot!!!!!
You are great!
"Vjekoslav Begovic" <vj*******@inet.hr> schreef in bericht
news:bf**********@sunce.iskon.hr...
You can do that, try this example (tested on IE6):

<html>
<head>
<script type="text/javascript">
var savedValue="";
function CheckScrollbar(){
var nomoretext=false;
var str = document.getElementById("nomorethanxrows").value;
var lines = str.split("\n");
var allowedLines =
document.getElementById("nomorethanxrows").getAttr ibute("rows");
var allowedCols =
document.getElementById("nomorethanxrows").getAttr ibute("cols")
if (lines.length > allowedLines){
nomoretext=true
}
var howmanyrows=0;
for (var i = 0; i<lines.length; i++){
var onelinelength =
(i==lines.length-1)?lines[i].length:lines[i].length-1;
if (onelinelength > allowedCols)
howmanyrows += Math.ceil(onelinelength/allowedCols);
else
howmanyrows++;
if (howmanyrows > allowedLines)
nomoretext=true;
}
if (nomoretext){
alert("No more text in my house.");
document.getElementById("nomorethanxrows").value = savedValue;
}
}
function SaveValue(){
savedValue=document.getElementById("nomorethanxrow s").value;
}
</script>
</head>

<body>
<textarea id="nomorethanxrows" rows="4" cols="15" onkeypress="SaveValue()"
onkeyup="CheckScrollbar()"></textarea>
</body>
</html>

"Simon" <si*******@planet.nl> wrote in message
news:bf**********@reader10.wxs.nl...
I have another question..
Let's take a textarea with the parameter: "rows=4"
(<textarea rows=4 onkeydown="CheckScrollbar()"> )

If you start typing the scrollbar at the right is not active. Only when

you
exceed the four lines (rows=4) the scrollbar becomes active.
That moment..the moment the scrollbar becomes active..can javascript
recognize/capture this moment?
Thanks, Simon


Jul 20 '05 #3
AAAAARRRGGGHHHHHHH!!!!!!!!!!!!!!!!

Sorry, but thats how much I was frustrated when I could not get a
simple thing to work on a static html page using javascript. I just
wanted to insert a line break into the textarea dynamically. Here is
the piece of code that will not work... but will give you a "unknown
runtime error". If you remove the "<br>"s, it will work.

<html>
<head>
<script language="JavaScript">
function writeText() {
document.all.myTextArea.innerHTML =
"Hello<br>" + "sometext" + "<br>Hello";
//THIS WONT WORK EITHER:
//document.all.myTextArea.innerHTML =
// "Hello\n" + "sometext" + "\nHello";
}
</script>

</head>
<body>
<table>
<tr><td id="mytd"><textarea
id="myTextArea"></textarea></td></tr>
<tr><td><input type="submit" name="submit" value="submit"
onClick="writeText();"/></td></tr>
</table>

</body>
</html>


But Internet Explorer did not like it. I visited a lot of newsgroups
and tried different things. I've tried replacing line breaks ("\n")
with <br>s and what not... but we wont go into it. What I am trying
to
say here is that I could not find a way to format the text inside a
text area. After hours of research, I just ended up doing something
like this... which by the way occured to me when I was finishing up
my
Dominos pineapple pizza. The workaround was to include the whole
textarea inside the javascript and write them into the TD using the
innerHTML of the TD at runtime. I sincerely hope that this will help
someone solve a similar issue and save them a lot of trouble.

=========
SOLUTION:
=========

Here is the code that I came up with to work around this situation...
//THIS IS THE WORKAROUND: (result is the id of TD, so you are
basically inserting html that CONTAINS the textarea into the TD
instead of writing text to the textarea. i.e., you are writing the
whole textarea into the TD at runtime)

<html>
<head>
<script language="JavaScript">
function writeText() {
var rslt;
rslt = "<textarea id=\"myTextArea\">";
rslt += "Hello\n" + "sometext" + "\nHello";
document.all.mytd.innerHTML = rslt + "</textarea>";
}
</script>

</head>
<body>
<table>
<tr><td id="mytd"> <textarea id="myTextArea"></textarea>
</td></tr>
<tr><td><input type="submit" name="submit" value="submit"
onClick="writeText();"/></td></tr>
</table>

</body>
</html>
GOOD LUCK!!!

You are welcome.

Jawad Shaik Mohammed
Stryker Instruments
Kalamazoo, MI
Ph: (269) 323-7700 x3500
Jul 20 '05 #4
"Simon" <si*******@planet.nl> wrote in message
news:bg*********@reader11.wxs.nl...
Vjekoslav..
You've been very helpful sending me this script, it workes well but i have a question.
When I type text in this textarea without hiiting return on my keyboard it's possible to exceed the limit off lines.
For example a textarea with your code and a maximum of 4 rows:
[textarea]
1111111111111
2222222222222
3333333333333
4444444444444
When I would go on typing (55555555555) i could get to the 5th line without an alert!
Could you perhaps look into that? It's very important to me that no one can exceed the limit in lines set by the rows.

Thank you in advance,
Simon


If you know the number of columns as well as the number of rows, you can
also trap the number of characters from being exceeded. The total possible
number of characters is the product of rows and columns. You can check how
many characters are in a form element like this:

tbox = document.getElementById('sometextbox');
if(tbox.value.length > (rows * cols)) {
tbox.value = tbox.value.slice(0, -1);
alert('I\'m watching you! Stop typing, and read the form
description.');
}

This would work in conjunction with the line break ("\n") checks since that
means the rows are being ended "prematurely" and therefore can not exceed
the total number of characters in your text box.

By the way, if this is "very important," you can't count on JavaScript to
keep people from turning scripting off and pasting a copy of "The Complete
Works of Shakespeare" in your textarea. You should also check the length of
user input in your form handler on the server. If this is only "mildly
important," you can probably trust JavaScript to only goof on you <10% of
the time.

HTH,
Zac
Jul 20 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
by: Gadrin77 | last post by:
I noticed when displaying the contents of a CDATA node inside a TEXTAREA using MSXML and XSL, I get an extra space before the data. at first I thought I hadn't "tightened up" the XSL, but then...
4
by: dekern | last post by:
I have been trying to set the default text value of a TextArea element for about a day now without any luck. Similar to the code used to set the Text field below I would like to use the returned...
4
by: Csaba Gabor | last post by:
What I'd like to do is to be able to set the font of a textarea element to the same font that another element is using (say, for example, an <INPUT type=text ...> element, but if that's a no go,...
4
by: Chris Sharman | last post by:
I haven't specified fonts, leaving the user to have their chosen font. However, different tags render in different default fonts: text, input, & textarea all different from one another. I guess...
5
by: Jesper Rønn-Jensen | last post by:
I have a textarea that must be limited to 70 characters. No big deal -- at least so I thought. * Textarea must not exceed 70 characters * Exceeding content must be cut off * Must work on input by...
8
by: Mark D. Smith | last post by:
Hi I have googled but not found a solution to wordwrap in a textarea using firefox/netscape. is there a style sheet solution or am i stuck with not being able to force wrapping in a textarea...
6
by: Tony | last post by:
The w3schools HTML tag reference for <textarea> http://www.w3schools.com/tags/tag_textarea.asp says that the attributes 'cols' and 'rows' are REQUIRED attributes for the textarea tag. Looking at...
7
by: Fabien LE LEZ | last post by:
Hello, I'd like to put, on a web page, a "place" where the user can type a rather long text, with automatic coloring of each word (e.g. a color depending on the number of letters of the word). ...
3
by: zjw2112 | last post by:
Hello. I have some javascript code that dynamically creates a textarea and sets the wrap value to hard, which I thought would preserve CR/LF in the textarea: var otherTextArea =...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.