rangeSlider errors when used in combination with input type="number"

[michalmikolajczyk]

When the rangeSlider is used with an input field of type="number", on any change of the slider, Angular throws errors:

Error: [ngModel:numfmt] Expected 2160 to be a number http://errors.angularjs.org/1.3.8/ngModel/numfmt?p0=2160 at REGEX_STRING_REGEXP (angular.js:63) at Array. (angular.js:19863) at Object.ngModelWatch (angular.js:20971) at Scope.$get.Scope.$digest (angular.js:14217) at Scope.$get.Scope.$apply (angular.js:14488) at HTMLDocument. (angular.rangeSlider.js:583) at HTMLDocument.jQuery.event.dispatch (jquery.js:5095) at HTMLDocument.jQuery.event.add.elemData.handle (jquery.js:4766)

The value in the input fiels does update. It all works ok, but still the errors are thrown.

The error is not thrown when the input field is changed directly. If input field does not have the type specified, there is no issue. It then works correctly, but all HTML5 goodness related to input type="number" is lost.

I created a plunker, which for some reason does not work (another issue?). Can't find the issue in the plunkr, but you can copy that code to chrome and see what I mean. Link to Plnkr: http://plnkr.co/edit/LFtWWGk9FV5XGDTaaPiA?p=info

Is there a way to use rangeSlider in combination with input type="number"?

[danielcrisp]

That looks like an internal Angular error to me...

Probably the model value is actually a string and therefore Angular throws an error when you try and put it in an <input type="number"> field, as they only accept numbers. See: https://docs.angularjs.org/api/ng/input/input%5Bnumber%5D

Its possible that there is a $filter somewhere that is converting the raw number into a string

No idea what's going on with the Plnkr... can't get it working

[michalmikolajczyk]

thanks for your prompt reply.

About the value being a string - I had the same assumptions at first, but I double checked. It is a number. I guess the proof that it is not an Angular issue is that changing the input type="number" field directly, e.g. by scrolling inside the input field, correctly changes the models value and does not throw an error.

the error is only thrown when moving the rangeSlider.

Is it possible that at any point you modify the value, so it loses type? or something similar?

[danielcrisp]

Found the culprit:

https://github.com/danielcrisp/angular-rangeslider/blob/master/angular.rangeSlider.js#L547 https://github.com/danielcrisp/angular-rangeslider/blob/master/angular.rangeSlider.js#L551

Perhaps if we wrapped these lines in parseFloat it would convert the string back into a number and it would work.

And the plnkr wasn't working because it didn't include jQuery.

Updated: http://plnkr.co/edit/c4gWaK8z0kyTnaCttAeO?p=preview

[michalmikolajczyk]

awesome. I'll try to fix it tonight. A colleague of mine added support for non-linear values of the slider. I will talk to him today evening and see if we can form pull requests in sync. thanks!!

[danielcrisp]

Fixed in version 0.0.12

Great, the non-linear values support sounds good

[meenakshijha]

@danielcrisp Is this issue fixed? I am getting the same error in version 0.0.14_ .