formating text box on the fly

szuccaro · Sep 10, 2003

I am trying to format text boxes in a form so
they dont have a float value..ie. 1.00236555..
Only need them to disply the number to its second
decimal place (money format).

I think this would be simple but am having a difficult
time finding number formating functions for javascript.
Any help or ides appreciated.- Steve

palbano · Sep 10, 2003

Steve,

There are no number formating functions in Javascript. You have to write them yourself. Have you tried? If your having trouble with your code post some of it and we can help you out.

Otherwise here is a Javascript class i use

Code:

function NumberFormat(){
	
	this.decimals = 2;
	this.preMask = &quot;&quot;;
	this.postMask = &quot;&quot;;
	this.commas = false;
	
	this.toString = nf_tostring;
	this._digitize = nf_digitize;
	this._insertCommas = nf_insCommas;
	this._parseDigits = nf_parseDigits;
	
	function nf_parseDigits( instr){
		var sret = new String(&quot;&quot;);
		for(nChr=0; nChr< instr.length; nChr++)
			if ( !isNaN(instr.charAt(nChr)) )
				sret += instr.charAt(nChr);
		return sret;
	}
	
	function nf_tostring( instr){
		if( 'string' != typeof(instr)) instr = new String(instr);
		var nums = instr.split(&quot;.&quot;);	//separate the number from the fraction
		
		if ( nums.length > 2)
			nums = new Array(nums[0], nums[1]);
			
		// make sure we have only digits on both sides of the decimal
		for(N=0; N< nums.length; N++)
			nums[N] = this._parseDigits(nums[N]);
			
		if ( this.commas)
			nums[0] = this._insertCommas(nums[0]);
		
		if ( 0 < this.decimals){
			if ( 2 > nums.length)
				nums[1] = new String(&quot;&quot;);
				
			nums[1] = this._digitize( nums[1]);
		}
		else
			nums = new Array(nums[0]);

		var sRet = new String(this.preMask);
	
		if ( nums.length > 1)
			sRet += nums.join(&quot;.&quot;);
						
		sRet += this.postMask;
			
		return sRet;
	}
	
	function nf_digitize( digits){
	
		var sret = new String(&quot;&quot;);
		for(nChr=0; nChr< digits.length && sret.length < this.decimals; nChr++)
			if ( !isNaN(digits.charAt(nChr)) )
				sret += digits.charAt(nChr);
				
		while( sret.length < this.decimals)
			sret += &quot;0&quot;;
			
		return sret;
	}
	
	function nf_insCommas( lnum){
	
		var rnum = new String(lnum);
		var sVal = new String(&quot;&quot;);
		// reverse the left number keeping only numeric values
		for(nChr=rnum.length; nChr>-1; nChr--){
			if ( !isNaN(rnum.charAt(nChr)) )
				sVal += rnum.charAt(nChr);
		}
		// if there were no digits assign a zero
		if ( 0 == sVal.length) sVal += &quot;0&quot;;
	
		// now reverse it again adding in commas
		rnum = new String(&quot;&quot;);
		for(nChr=0; nChr< sVal.length; nChr++){
			rnum = sVal.charAt(nChr) + rnum;
			switch( nChr){
			case 2:
			case 5:
			case 8:
			case 11:
				if ( nChr < sVal.length -1)
					rnum = &quot;,&quot; + rnum;
				break;
			default:
				break;
			}	// switch( for each comma)
		}	// for()
		
		return rnum;
	}	// fn_insCommas()
}	// NumberFormat class

-pete

szuccaro · Sep 10, 2003

I am currently using number functions. the big problem
I am having is that the text boxs are created on the fly
and im having trouble assining values to them. If there
is a way to put together a variable name or object on
the fly this would solve my problem.
EX:
n=1;

while(n<100)
{
"document.form.text" + n + ".value" = n + 15;
n++
}

..I know exactly what there names are going to be
cause when there made, a PHP script just addes the
current value of a counter vairable "n" to there
names. As I said before, I can get there value by
looping through thier names but cant seem so assign
a value to them (the formated number)...

szuccaro · Sep 10, 2003

PS: I was hoping there would be some number functions
I could use within the tag for the text box so I could
just change there value using OnBlur() event. But apparetly
I have to use a function at the top of my page to change the value, I could use function in each tag for each text box, buta thats alot of code to have in a simple tag for an input box

palbano · Sep 10, 2003

Maybe this example will help:

Code:

<html>
<SCRIPT LANGUAGE=javascript>
<!--
function format( e){
	var nf = new NumberFormat();
	// to change the format from the default, set the
	// nf properties before calling toString()
	e.value = nf.toString( e.value);
}
//-->
</SCRIPT>
<body>
<INPUT type=&quot;text&quot; onblur=&quot;format(this);&quot;>
</body></html>

-pete

szuccaro · Sep 10, 2003

Calling function using onChange:
=================================================
(all the "\" are for PHP so it dosnt get confused.

<input type=\"text\" name=\"total$n\" size=\"12\" onChange=\"format_this(this);\">

Then heres the function:
=================================================
function format_this(valueOFtotal)
{
var a= new ToFmt(valueOFtotal);
valueOFtotal.value = a.fmtF(13,2);
}

Its not working though ????

szuccaro · Sep 10, 2003

I have got it to work!
Thanks for all your input.
-Steve

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

formating text box on the fly

szuccaro

Programmer

palbano

Programmer

szuccaro

Programmer

szuccaro

Programmer

palbano

Programmer

szuccaro

Programmer

szuccaro

Programmer

Similar threads

Part and Inventory Search

Sponsor