Roo/bootstrap/PhoneInput.js

[roojs1] / Roo / bootstrap / PhoneInput.js

diff --git a/Roo/bootstrap/PhoneInput.js b/Roo/bootstrap/PhoneInput.js
index 4089127..b5621f1 100644 (file)
--- a/Roo/bootstrap/PhoneInput.js
+++ b/Roo/bootstrap/PhoneInput.js
@@ -25,8 +25,6 @@ Roo.bootstrap.PhoneInput = function(config) {
 
 Roo.extend(Roo.bootstrap.PhoneInput, Roo.bootstrap.TriggerField, {
         
-        triggerList : true,
-        
         listWidth: undefined,
         
         selectedClass: 'active',
@@ -35,12 +33,20 @@ Roo.extend(Roo.bootstrap.PhoneInput, Roo.bootstrap.TriggerField, {
         
         validClass: 'has-success',
         
+        allowed: '0123456789',
+        
+        max_length: 15,
+        
+        /**
+         * @cfg {String} defaultDialCode The default dial code when initializing the input
+         */
         defaultDialCode: '+852',
         
+        /**
+         * @cfg {Array} preferedCountries A list of iso2 in array (e.g. ['hk','us']). Those related countries will show at the top of the input's choices
+         */
         preferedCountries: false,
         
-        //white list / black list for countries?
-        
         getAutoCreate : function()
         {
             var data = Roo.bootstrap.PhoneInputData();
@@ -75,6 +81,8 @@ Roo.extend(Roo.bootstrap.PhoneInput, Roo.bootstrap.TriggerField, {
             var input =  {
                 tag: 'input',
                 id : id,
+                type: 'number',
+                maxlength: this.max_length,
                 cls : 'form-control tel-input',
                 autocomplete: 'new-password'
             };
@@ -287,8 +295,8 @@ Roo.extend(Roo.bootstrap.PhoneInput, Roo.bootstrap.TriggerField, {
             
             this.list.on('mouseover', this.onViewOver, this);
             this.list.on('mousemove', this.onViewMove, this);
-            //this.list.on('scroll', this.onViewScroll, this);
-            this.inputEl().on("keyup", this.onKeyUp, this);
+            // this.inputEl().on("keyup", this.onKeyUp, this);
+            this.inputEl().on("keypress", this.onKeyPress, this);
             
             this.tpl = '<li><a href="#"><div class="flag {iso2}"></div>{name} <span class="dial-code">+{dialCode}</span></a></li>';
 
@@ -303,7 +311,7 @@ Roo.extend(Roo.bootstrap.PhoneInput, Roo.bootstrap.TriggerField, {
         onTriggerClick : function(e)
         {
             Roo.log('trigger click');
-            if(this.disabled || !this.triggerList){
+            if(this.disabled){
                 return;
             }
             
@@ -412,7 +420,8 @@ Roo.extend(Roo.bootstrap.PhoneInput, Roo.bootstrap.TriggerField, {
                 cls: 'typeahead typeahead-long dropdown-menu tel-list',
                 style: 'display:none'
             });
-            this.list.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay = 'block';;
+            
+            this.list.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay = 'block';
         },
         
         collapseIf : function(e)
@@ -498,8 +507,10 @@ Roo.extend(Roo.bootstrap.PhoneInput, Roo.bootstrap.TriggerField, {
             this.validate();
         },
         
-        getDialCode : function(v = '')
+        getDialCode : function(v)
         {
+            v = v ||  '';
+            
             if (v.length == 0) {
                 return this.dialCodeHolder.dom.value;
             }
@@ -535,10 +546,24 @@ Roo.extend(Roo.bootstrap.PhoneInput, Roo.bootstrap.TriggerField, {
             return this.el.select('input.hidden-tel-input',true).first();
         },
         
-        onKeyUp : function(e)
-        {
-            Roo.log(e.getKey());
+        onKeyUp : function(e){
+            
+            if(this.allowed.indexOf(String.fromCharCode(e.getCharCode())) === -1){
+                e.stopEvent();
+            }
+            
+            Roo.log(this.getValue());
+            
             this.setValue(this.getValue());
+        },
+        
+        onKeyPress : function(e){
+            
+            if(this.allowed.indexOf(String.fromCharCode(e.getCharCode())) === -1){
+                e.stopEvent();
+            }
         }
         
+        
+        
 });
\ No newline at end of file