Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Step attribute not working as expected #95

Open
JerVoo opened this issue Jan 13, 2016 · 3 comments
Open

Step attribute not working as expected #95

JerVoo opened this issue Jan 13, 2016 · 3 comments

Comments

@JerVoo
Copy link

JerVoo commented Jan 13, 2016

I've been using the range slider for a while, but I just found out that the step attribute is not working as expected.

I'm using the following HTML:

<div
    range-slider
    min="0"
    max="10"
    step="0.01"
     orientation="horizontal"
     decimal-steps="2"
     model-min="data.constructies.perimeter.min"
     model-max="data.constructies.perimeter.max"
     >
 </div>

 <div class="row">
     <div class="col-md-5">
         <input type="number" ng-model="data.constructies.perimeter.min" class="form-control" step="0.01">
    </div>
    <div class="col-md-2 text-center">
        -
    </div>
    <div class="col-md-5">
        <input type="number" ng-model="data.constructies.perimeter.max" class="form-control" step="0.01">
    </div>
</div>

As you can see, the model is being used in the slider as well as in an number input. Both the slider and the input have the step attribute set to 0.01, but when using the slider, the steps are always 1, eventhough it's being set to 0.01. The step size of 0.01 does work in the number input, so the problem is not being cause by the input doing some wierd stuff with the data.

How can it be that this doesn't work?

@umair-khanzada
Copy link

@JerVoo: can you solve this issue ?
i have same issue it's working with decimal number like 1,2,5,10, but not working with fractional value like 0.1, .1, 0.02 etc.

@danielcrisp
Copy link
Owner

It's been a while since I looked at this but I think the problem is the rounding here:

proposal = Math.round(proposal / per) * per;

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

Basically step must be an integer otherwise this calculation doesn't work.

You could try scaling up your model values, so instead of 0-10 with a step of 0.01 you could use 0-1000 with a step of 1 and then scale them back down again in the UI / when you need to use them elsewhere.

Or perhaps someone could submit a PR with an improvement to the calculation?

@umair-khanzada
Copy link

@danielcrisp : thank you for your response.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants