Erlaube europäische Formateingabe in ShieldUI NumericTextBox

Question

Standardmäßig erlaubt ShieldNumericTextBox keine Eingabe von Kommas und formatiert die eingegebene Zahl automatisch ins amerikanische Format (z. B. nach der Eingabe von 10000, wird es 10.000 sein).

Ich möchte das Standardformat auf europäisches Format ändern, fand ich (textTemplate) -Option bei der Einleitung des Textfelds, aber es hat nicht funktioniert für mich zum Formatieren der Eingabe, es ist nützlich für das Hinzufügen von Text neben die Nummer (zB KG, EUR ... etc).

$("#numericTextBox").shieldNumericTextBox({ 
    textTemplate: "{0:##,##}", // The numbers in my case are percentages with 2 digits after decimal. 
    min: 0, 
    max: 1, 
    step: 0.01, 
    spinners: true 
}); 

Diese textTemplate ausgegeben die gleiche Zeichenfolge ("{0: ##, ##}"), wenn der Benutzer eingegeben haben und konzentrieren sich die Textbox aus.

Und auch nicht während der Eingabe formatiert, nur wenn Sie beenden und entfernen Sie den Fokus von der Eingabe, so wird es nicht viel helfen. Irgendeine Hilfe?

Answer 1

ShieldUI verwendet Globalize JS, um die kulturspezifische Formatierung von Werten zu handhaben.

In Ihrem Fall sollten Sie zuerst die Kultur auf eine setzen, die ganze Zahlen von den Dezimalziffern einer Zahl durch ein Komma anstelle eines Punktes trennt. Dann können Sie ein Format festgelegt für die textTemplate es als numerischer Wert angezeigt werden mit 2 Dezimalstellen wie folgt aus:

<!-- include the globalize culture --> 
<script src="globalize.culture.de.js" type="text/javascript">//</script> 

<script type="text/javascript"> 
$(document).ready(function() { 
    // set a German Globalize culture 
    Globalize.culture("de"); 

    $("#numericTextBox").shieldNumericTextBox({ 
     textTemplate: "{0:n2}", // display as numeric having 2 decimal fields 
     min: 0, 
     max: 1, 
     step: 0.01, 
     spinners: true 
    }); 

}); 
</script> 

Ein weiterer Weg, um den Text zu manipulieren gezeigt wird, eine Funktion wie das schaffen, für die nachstehend Wert von textTemplate:

textTemplate: function(value) { return "_custom_formatted_string_"; } 

die alle Perioden durch ein Komma ersetzen.