Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 06-01-2009, 06:09 PM   PM User | #1
shedokan
Regular Coder

 
Join Date: Oct 2007
Posts: 277
Thanks: 2
Thanked 4 Times in 4 Posts
shedokan has a little shameless behaviour in the past
Is there any way to wrap text in a textarea in FF?

Is there any way that I can make a textarea wrap in firefox?
I've tried this:

Code:
calculateLines: function(text){
	text = text.split('\n').join('');

	temp = '';
	chcount = tchs = c= 0;
	do {
		ch = text.substring(c, c+1); // first character
		if(ch == '\n'){ // if character is a hard return
			temp += ch;
			chcount = 1;
		} else if(chcount == 9) { // line has max chacters on this line
			temp += '\n' + ch; // go to next line
			chcount = 1; // reset chcount
		} else {// Not a newline or max characters ...
			temp += ch;
			chcount++; // so add 1 to chcount
		}
	} while(++c<text.length);
	return temp;
}
updateInput: function(){
	val=this.textarea.val();
	if($('textarea',this.name).length==0){
		return false;
	}
	lastval=val;
	if(!val){
		this.textarea.height(14);
		return false;
	}
	input=this.textarea[0];

	if(document.selection) {
		r = document.selection.createRange();
		re = input.createTextRange();
		rc = re.duplicate();
		re.moveToBookmark(r.getBookmark());
		rc.setEndPoint('EndToStart', re);

		lastsel = rc.text.length;
	} else if(input.selectionStart || input.selectionStart == '0'){
		lastsel = input.selectionStart;
	}
	toomuch=false;
	if(val.length>199){
		val=this.textarea.data('val');
		this.textarea.val(val);
		--lastsel;
		toomuch=true;
	}

	text=this.calculateLines(val);
	ns=text.split('\n').length;
	if(this.textarea.data('ns')!=ns){
		this.textarea.height( ns*14 ).data('ns',ns);
	}

	if(!toomuch && text!=lastval){
		this.textarea.val(text);

		tmp=text.split('\n').join('');
		if(tmp!=lastval && tmp.length<=199 || ns-1==1){
			if(Math.round(lastsel/10)*10==lastsel){
				++lastsel;
			}
			this.textarea.data('val',text.split('\n').join(''));
		}
	}
	if(!document.selection){
		input.selectionStart=input.selectionEnd=lastsel;
	} else {
		var selRange = input.createTextRange();
		selRange.collapse(true);
		selRange.moveStart("character", lastsel);
		selRange.moveEnd("character", 0);
		selRange.select();
		input.focus();
	}
}
I am calling updateInput with this:
setInterval(function() { self.updateInput() }, 10);

it's kinda not understandable but maybe someone can figure it out.

thanks.
shedokan is offline   Reply With Quote
Old 06-01-2009, 06:23 PM   PM User | #2
Eldarrion
Regular Coder

 
Join Date: Feb 2009
Location: Wheeling, IL
Posts: 358
Thanks: 5
Thanked 62 Times in 60 Posts
Eldarrion is on a distinguished road
What you're looking for is the WRAP attribute for textareas. Usually a value of "soft", "hard" or "off", though it won't split a word in two to wrap in the textarea, so a word that is longer than the displayed columns (cols attribute) will not wrap. Try, see how it works for you.
__________________
The way to success is to assume that there are no impossible things. After all, if you think something is impossible, you will not even try to do it.

How to ask smart questions?
Eldarrion is offline   Reply With Quote
Old 06-01-2009, 09:47 PM   PM User | #3
rnd me
Senior Coder

 
rnd me's Avatar
 
Join Date: Jun 2007
Location: Urbana
Posts: 3,469
Thanks: 9
Thanked 466 Times in 450 Posts
rnd me is a jewel in the roughrnd me is a jewel in the roughrnd me is a jewel in the rough
Code:
String.prototype.lineWrap=function (colLen, delm) {
    if (!delm) {
        delm = "-\n";
    }
    if (!colLen) {
        colLen = this.length;
    }
    var bs = "";
    var mx = this.length;
    for (i = 0; i < mx; i += colLen) {
        bs += this.slice(i, i + colLen) + delm;
    }
    return bs.slice(0, (bs.length - delm.length));
}
arg1 is the # of chars per line
arg2 (optional )is the delimiter to use between lines, defaults to "-\n"...


example:
Code:
"Hello world, this is JavaScript".wrap(11);
results:
Code:
Hello world-
, this is J-
avaScript
__________________
my site (updated 5/13)
STATS (2013/5) HTML5:90.2% MOB:14% IE7:0.5% IE8:8.6% IE9:9.8% IE10:10%
rnd me is offline   Reply With Quote
Old 06-01-2009, 09:48 PM   PM User | #4
shedokan
Regular Coder

 
Join Date: Oct 2007
Posts: 277
Thanks: 2
Thanked 4 Times in 4 Posts
shedokan has a little shameless behaviour in the past
That's the problem I want to split a long word, because it is used for an OS files rename system.
shedokan is offline   Reply With Quote
Old 06-02-2009, 01:04 AM   PM User | #5
shedokan
Regular Coder

 
Join Date: Oct 2007
Posts: 277
Thanks: 2
Thanked 4 Times in 4 Posts
shedokan has a little shameless behaviour in the past
rnd me:
Sorry didn't see that before I posted.

there is one major problem with your code, and that is that if the user is editing the text and it updates the textarea, the editing poointer goes to the end.

that's why I'm saving it and placing it back in place.
shedokan is offline   Reply With Quote
Old 06-02-2009, 08:42 AM   PM User | #6
rnd me
Senior Coder

 
rnd me's Avatar
 
Join Date: Jun 2007
Location: Urbana
Posts: 3,469
Thanks: 9
Thanked 466 Times in 450 Posts
rnd me is a jewel in the roughrnd me is a jewel in the roughrnd me is a jewel in the rough
Quote:
Originally Posted by shedokan View Post
rnd me:
Sorry didn't see that before I posted.

there is one major problem with your code, and that is that if the user is editing the text and it updates the textarea, the editing poointer goes to the end.

that's why I'm saving it and placing it back in place.
you could backup the cursor loc just before, and re-apply it just after.

in firefox it's as simple as
Code:
var oldPos = txt.selectionStart.
// do you stuff
txt.selectionStart=txt.selectionEnd=oldPos;

you might want to also backup and restore txt.scrollTop: the vertical scroll position.
__________________
my site (updated 5/13)
STATS (2013/5) HTML5:90.2% MOB:14% IE7:0.5% IE8:8.6% IE9:9.8% IE10:10%
rnd me is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 06:26 PM.


Advertisement
Log in to turn off these ads.