telerik / kendo-angular

Issue tracker - Kendo UI for Angular
http://www.telerik.com/kendo-angular-ui/
Other
469 stars 217 forks source link

Numeric Textbox Long Numbers - problems #704

Closed squadwuschel closed 7 years ago

squadwuschel commented 7 years ago

When I try to use a the numeric Textbox with long numbers,

Frist Poblem when you insert the following Number:

12345678901234567890

and leave the field then a other number is schown

grafik

and when you enter the field again the folowing Number is schon

12345678901234567000

    <kendo-numerictextbox
        [value]="value" [min]="0" [max]="9223372000000000000" [format]="'n0'" style="width:500px;">
    </kendo-numerictextbox>

http://plnkr.co/edit/jX4ihcUdOIebJZ4yBalB?p=preview

Second Problem is when you have decimal numbers

    <kendo-numerictextbox
        [value]="value" [min]="0" [max]="7.92281625e+28" [format]="'n6'" [decimals]="6" style="width:500px;">
    </kendo-numerictextbox>

and you beginn to insert a long number like

123456789012345678901234

then the Input field resets and shows

grafik

http://plnkr.co/edit/Y6TVLHftqyRsUJU0b6ZD?p=preview

ggkrustev commented 7 years ago

Hi @squadwuschel,

the NumericTextBox uses a JavaScript Number object to keep its value which has a certain precision limitation. In general, the Number object persists its precision up to 16 digits. Numbers longer than 16 digits get converted to exponential numbers and lose their precision. Because the widget relies on a Number object, it gets the same precision limitation.

This limitation comes from JavaScript itself and you cannot work around it in a feasible way. I am afraid, that the only recommendation that we can provide is to use an element combined with some kind of server validation because some server languages can parse long numbers.

Another option would be to use custom Number implementations, like big-integer, which will handle the long number scenario. Unfortunately, such custom implementation cannot be used with NumericTextBox and it is required to build a custom component to utilize those custom types.

sourabhdeep commented 4 years ago

I have handled this way(for max 12 character length)- Html file-> <kendo-numerictextbox [format]="'n0'" [decimals]="'5'" [spinners]="false" formControlName="paidAmount" (keydown)="setOldVal()" (paste)="setOldVal();" (input)="setMaxVal();">

TS file-> export class abcComponent implements OnInit { dataForm: FormGroup; paidAmountOldVal:number; ngOnInit() { this.dataForm.addControl('paidAmount', new FormControl({ value: 0, disabled: false })); } setOldVal() { this.paidAmountOldVal=this.dealDataForm.get('paidAmount').value;
} setMaxVal(textBoxType:string) { if (this.dealDataForm.get('paidAmount').value) { let charlength: number = this.dealDataForm.get('paidAmount').value.toString().length; if (charlength > 12) { this.dealDataForm.controls['paidAmount'].setValue(this.nylParticipationAmountOldVal); } }

} }