顯示和輸入數字作爲貨幣ExtJS

Question

我正在使用ExtJS 4.1，並試圖顯示我的貨幣字段值/ 1000，但只顯示。 例如，如果用戶輸入1234.56，它將在屏幕上顯示爲1,234.56，但僅當它顯示在屏幕上時。對於其他所有內容，它存儲爲1234560.在該數字後面的每個計算中，都被視爲1234560.我使用bigint作爲商店，並且我想避免浮動，因爲在我的國家，20億是正常數字，但也會需要小數部分。

你怎麼能這樣做？

謝謝。

Answer 1

玩過後，我有另一個解決方案，一個基於模型。 創建一個不存在的字段，例如price_display，並用它來顯示;

Ext.define('app.model.PriceSample', { 
    extend: 'Ext.data.Model', 
    field: [ 
    {name: 'price', type: 'int'}, 
    {name: 'price_display', type: 'float', convert: function (value, records) { 
     if (value) { //on write 
     record.set('price', value * 1000); 
     return value; 
     } else { 
     return record.get('price')/1000; 
     } 
    }} 
    ] 
} 

在您的網格或組合或任何使用price_display而不是價格。但是當你想要執行數學時，請使用價格。

Answer 2

一種方法是創建一個擴展基本文本框的新組件，將名爲storedValue的屬性添加到它，併爲焦點和模糊事件註冊處理程序以將存儲的值轉換爲十進制值以顯示/編輯，然後轉換爲逗號格式的版本，並用整數值更新存儲的值。

編輯

剛回來工作的思想代碼這個老段可能是有用的。這是我爲自己創造的貨幣領域。父窗體上的偵聽器只能用於具有before/after更新事件的表單的擴展版本。可能有更好的方法來完成這一點，比如根據需要在應用程序中重載getValue，getSubmitValue和getSubmitData函數。我的需要是顯示貨幣符號和逗號，因此需要根據您的需求進行修改，但如果您尚未太久或遇到任何問題，它應該提供一個體面的起點。祝你好運。

Ext.define('Ext.ux.form.field.Currency', { 
    extend: 'Ext.form.field.Text', 

    alias: 'widget.currencyfield', 

    initComponent: function (config) { 
     this.callParent(arguments); 
    }, 

    hasFocus: false, 

    listeners: { 
     render: function() { 
      var form = this.findParentByType('form'); 

      form.on('afterLoadRecord', function() { 
       this.toRaw(); 
       if (this.getRawValue() == 0) { 
        this.setRawValue(''); 
       } else { 
        this.toFormatted(); 
       } 
      }, this); 

      form.on('beforeUpdateRecord', function() { 
       this.toRaw(); 
      }, this); 

      form.on('afterUpdateRecord', function() { 
       this.toRaw(); 
       if (this.getRawValue() == 0) { 
        this.setRawValue(''); 
       } else { 
        this.toFormatted(); 
       } 
      }, this); 
     }, 
     focus: function (field, e, eOpts) { 
      this.toRaw(); 
      this.hasFocus = true; 
     }, 
     blur: function (field, e, eOpts) { 
      //Clear out commas and $ 
      this.toRaw(); 

      //If there's a value, format it 
      if(field.getValue() != '') { 
       this.toFormatted(); 
       this.hasFocus = false; 
      } 
     } 
    }, 

    stripAlpha: function (value) { 
     return value.replace(/[^0-9.]/g, ''); 
    }, 

    toRaw: function() { 
     if (this.readOnly !== true) { 
      this.setRawValue(this.stripAlpha(this.getRawValue())); 
     } 
    }, 

    toFormatted: function() { 
     this.setRawValue(Ext.util.Format.currency(this.getRawValue(), '$ ', 0)); 
    }, 

    getValue: function() { 
     return parseFloat(this.stripAlpha(this.getRawValue())); 
    } 
});