Connecting Tech Pros Worldwide Help | Site Map

Numeric Text Box Format

  #1  
Old August 11th, 2008, 02:34 AM
progdoctor's Avatar
Newbie
 
Join Date: Jul 2008
Location: Jakarta
Posts: 13
I have scripts that can format a HTML input value as a numeric format or money format.. Hope its useful

Expand|Select|Wrap|Line Numbers
  1. function XFormat(arrayCtl)
  2. {
  3.     this.arrCtl = arrayCtl;
  4.     if (typeof XFormat._initialized == 'undefined') 
  5.     {
  6.         XFormat.prototype.setKeyPress = function(){return 0;};
  7.         XFormat.prototype.setFocus = function(){this.select();};
  8.         XFormat.prototype.setBlur = function(){return 0;};
  9.         XFormat.prototype.setFormat = function (){return 0;}; 
  10.  
  11.         XFormat._initialized = true;
  12.     }
  13. }
  14.  
  15. function XFormatNumber(arrayCtl)
  16. {
  17.     XFormat.call(this,arrayCtl);
  18.     if (typeof XFormatNumber._initialized == 'undefined') 
  19.     {
  20.         XFormatNumber.prototype.setKeyPress = function()
  21.         {
  22.             //mengizinkan karakter '-'(minus),'0-9'(numerik)
  23.             if(event.keyCode==45)
  24.                 return true;
  25.             else if(event.keyCode>=48 && event.keyCode<=57)
  26.                 return true;
  27.             else
  28.                 return false;
  29.         };
  30.  
  31.         XFormatNumber.prototype.setBlur = function()
  32.         {
  33.             if(this.value=='' || isNaN(this.value))
  34.                 this.value = 0;
  35.         };
  36.  
  37.         XFormatNumber.prototype.setFormat = function () 
  38.         {
  39.             if(this.arrCtl.length>0)
  40.             {
  41.                 for(var i=0;i<this.arrCtl.length;i++)
  42.                 {
  43.                     this.arrCtl[i].style.textAlign='right';
  44.                     this.arrCtl[i].onkeypress = this.setKeyPress;
  45.                     this.arrCtl[i].onfocus = this.setFocus ;
  46.                     this.arrCtl[i].onblur= this.setBlur;
  47.                 }
  48.             }
  49.         };
  50.  
  51.         XFormatNumber._initialized = true;
  52.     }
  53. }
  54. XFormatNumber.prototype = new XFormat();
  55.  
  56. function XFormatMoney(arrayCtl)
  57. {
  58.     XFormatNumber.call(this,arrayCtl);
  59.     if (typeof XFormatMoney._initialized == 'undefined') 
  60.     {    
  61.         XFormatNumber.prototype.setKeyPress = function()
  62.         {
  63.             //mengizinkan karakter '-'(minus),'.'(separator desimal),'0-9'(numerik)
  64.             if(event.keyCode >=45 && event.keyCode<=46)
  65.                 return true;
  66.             else if(event.keyCode>=48 && event.keyCode<=57)
  67.                 return true;
  68.             else
  69.                 return false;
  70.         };
  71.  
  72.         XFormatMoney.prototype.setFocus =  this.getOriginalValue;
  73.  
  74.         XFormatMoney.prototype.setBlur = function()
  75.         {
  76.             var nStr = this.value+'';
  77.             var rgx = /(\d+)(\d{3})/;
  78.             var x;
  79.             if(this.value=='' || isNaN(this.value))
  80.                 {this.value = '0.00';}
  81.             else
  82.             {
  83.                 x = nStr.split('.');
  84.                 var x1 = x[0];
  85.                 var x2 = x.length > 1 ? '.' + x[1] : '.00';
  86.                 while (rgx.test(x1)) 
  87.                 {
  88.                     x1 = x1.replace(rgx, '$1' + ',' + '$2');
  89.                 }
  90.                 if(x.length > 1 && x[1].length >2)
  91.                     x2 = '.'+x[1].substring(0,2);
  92.                 this.value = x1 + x2;
  93.             }
  94.         };
  95.  
  96.         XFormatMoney._initialized = true;
  97.     }
  98. }
  99. XFormatMoney.prototype = new XFormatNumber();
  100. XFormatMoney.prototype.getOriginalValue = function()
  101. {
  102.     var originalValue=0;
  103.     var re = /,/;
  104.     if(this.value!='')
  105.     {
  106.         originalValue=this.value.replace(re,'');
  107.         if(parseFloat(originalValue).length != originalValue)
  108.             originalValue = parseFloat(originalValue);
  109.     }
  110.     this.value = originalValue;
  111.     this.select();
  112. }
  113.  
and this is how to use that functions

Expand|Select|Wrap|Line Numbers
  1. txtMoney1 = document.getElementById('txtMoney1');
  2. txtMoney2 = document.getElementById('txtMoney2');
  3. txtNumber1 = document.getElementById('txtNumber1');
  4. txtNumber2 = document.getElementById('txtNumber2');
  5.  
  6. oXFormatNumber = new XFormatNumber([txtNumber1,txtNumber2]);
  7. oXFormatNumber.setFormat();
  8. oXFormatMoney =new XFormatMoney([txtMoney1,txtMoney2]);
  9. oXFormatMoney.setFormat();
  10.  
  11.  



Reply


Similar Threads
Thread Thread Starter Forum Replies Last Post
Cannot enter scientific notation into text box bound to strongly typed dataset Greg answers 0 November 17th, 2005 11:51 AM
Validating Text box with multiple variables Mark answers 3 July 20th, 2005 12:40 PM