ejNumericTextBox: Setting to German Locale with Angular control

[Greg Gannicott]

Hi.

We're attempting to use globalization so that the numeric spinner will handle commas as periods when set with a locale of "de-DE".

I can get this working on this demo when using just jQuery:

http://jsplayground.syncfusion.com/241dxkeo

But when I've attempted it with an Angular control (please see the attached zip file) it fails to work.

Is there something I'm doing wrong, or it is a bug specific to the Angular control?

Thanks.

Attachment: German_Demo_927744f6.zip

[Balamurugan P]

Hi Greg,

Sorry for the inconvenience caused.

We have analyzed the stated issue with your sample and we could found that you are using previous version of “globalize.culture.de-DE.js” culture file. In 13.4.0.53^rd release onwards, we have provided in-built support for the localization of various cultures. These details are specified in following release notes. Release notes link: http://help.syncfusion.com/js/release-notes/v13.4.0.53?type=features

For more details about the localization support, you can refer our UG document link: http://help.syncfusion.com/js/localization

In following sample, we have replaced “ej.culture.de-DE.min” culture file instead of “globalize.culture.de-DE”, the sample is running without any issue. Please find the updated sample under the following location.

Sample: http://www.syncfusion.com/downloads/support/forum/123751/ze/Code1326432038

Please let us know if you have any queries.

Regards,

Balamurugan

[Greg Gannicott]

Hi.

Thanks for the quick response.

I've just tested the demo you provided, and I'm experiencing a different problem with it.

I enter:

"1,2"

and it appears ok in the input box.

However, when I then click away from the input box, it displays as:

"12,00"

I would expect it to display as:

"1,20".

Is this a bug or has something been implemented incorrectly in the demo?

Cheers.

[Balamurugan P]

Hi Greg,

Sorry for the inconvenience caused.

We have analyzed the stated issue and the reported problem occurs due to improper way of value binding in “ejNumericTextbox” widget. To solve this problem, you need to use “e-value” attribute in the “NumericTextbox” input element instead of using the “ng-model”, since “e-value” will handle the two way binding.

We have prepared a sample based on this and you can find the sample under the following location:

Playground sample link: http://jsplayground.syncfusion.com/situe3ue

To know more details about a sample creation on “AngularJS” for our Syncfusion widgets, please refer the following UG document link. http://help.syncfusion.com/js/angularjs

Please let us know if you have any queries.

Regards,

Balamurugan

[Greg Gannicott]

Hi.

The reason I was using ng-model rather than e-value was that I was experiencing an issue where e-change was not triggering for changes when using e-value for the binding.

The only way I could act on changes was using ng-change (which requires ng-model to be used).

But - as you've seen - we're running an out of date version SyncFusion at the moment so perhaps that's been fixed (e-value and e-change certainly work using a modified version of your demo, thanks).

When we do upgrade (which we're attempting to do - but we're experiencing other issues) I'll try what you've suggested.

Thanks for your help.

[Greg Gannicott]

Hi.

I've created a forum post to address the issues I mentioned we're having with e-value which is preventing us from using it in order to support the German locale correctly (as well as address some other bugs we have):

https://www.syncfusion.com/forums/123786/ej-numerictextbox-e-value-behaving-differently-to-ng-model

Thanks.

[Balamurugan P]

Hi Greg,

Sorry for the inconvenience caused.

Query: In old version, I was experiencing an issue where e-change was not triggering for changes when using e-value for the binding.

We have analyzed the stated issue with your provided sample and we suspect that you may be specified the handling function of “change” event like “outputTestValue()”.  Here you have to specify the event handling function name like “outputTestValue” without having “()” brackets. Refer following code examples to solve this problem.

Code example [HTML]

<input id="ThresholdsRedValueInput" ej-numerictextbox e-value="testValue" e-decimalplaces="2" type="text" e-change="outputTestValue" e-locale="de-DE" />

Code example [JavaScript]

angular.module('demo', ["ejangular"]);

angular.module('demo').controller("demoController", function($scope) {

    $scope.testValue = 2.2;   

    $scope.outputTestValue = function(args) {

        console.log("Test Value", args.value);

    };

});

We have modified the sample based on this and it is running without the specified issue. Please find the modified sample under the following location.

Sample: http://www.syncfusion.com/downloads/support/forum/123751/ze/Code697236303

Please let us know if you need any further assistance.

Regards,
Balamurugan