1. Home
  2. Forum
  3. Blazor
  4. Step not working correctly when changing Min/Max

Step not working correctly when changing Min/Max

I know it's a particular case, but lets's suppose I create a slider like the following:

<SfSlider @ref="slider" @bind-Value="sliderValue" Min="0" Max="Days" Step="1">
</SfSlider>

With a Days value of 100.
Running the application, all works correctly, and we are happy.
Now I change at runtime the value of 'Days', to 200, and call StateHasChanged().
The slider reflects the new situation, and I can drag the 'handle' of the slider to any value I want (of course now from 0 to 200).
BUT, if I use the arrow keys, the step is not 1 anymore, but it's 2. So it 'jumps' on even or odd values, depending on the starting point I dragged it to.
It's like the slider is updated correctly to the new interval, EXCEPT the increment, that remains proportioned to the original one, calculated during the creation.
By the way, I tried to call a 'slider.Refresh()', but it tells me this method doesn't exist. I thought it was on any of your components.
Thank you.

3 Replies 1 reply marked as answer
SS Sharon Sanchez Selvaraj Syncfusion Team May 5, 2021 04:22 PM UTC

Hi Andrea, 
 
Thanks for contacting Syncfusion Support. 
 
We checked with your reported code snippet and have dynamically changed the Max value through button click as well as with arrow buttons. But we are unable to replicate the mentioned issue. 
 
Please refer to the following sample. 
 
 
Kindly provide the following details so that we can assist you promptly. 
 
  1. Package version used in your application.
  2. Are you using any other Slider properties like Ticks and Tooltip in your application?
  3. Else you have bound any events for Slider?
  4. Are you rendering Slider inside any other components, like Dialog or Tab?
  5. If possible, modify the above sample to reproduce your issue.
  6. Else provide a video replicating your issue.
 
Regards, 
 
Sharon Sanchez S. 


AB Andrea Bioli May 6, 2021 08:23 PM UTC

Your example perfectly shows the problem in a simplified way, compared to my full application.
I added to your (razor) code just a line to show the current value:

<div>@(sliderValue)</div>

Now, do the following:
- Drag *with the mouse* the selector to a value around 30
- Click the button to update the total to 200
- Drag again *with the mouse* the selector to around 70
- Now the selector is already focused, so trying to use to keyboard arrows (left, right, up, down) will move the value of a much bigger than 1 value (there is some proportion, it depends on the starting and ending values of the drag operation, but if you followed this example, it should 5.

(Thank you for the example, anyway, I didn't know about the .Reposition method).

Andrea Bioli

SS Sharon Sanchez Selvaraj Syncfusion Team May 7, 2021 02:59 PM UTC

Hi Andrea, 
 
We checked with your provided steps and were able to replicate the issue in our end. We have considered it as a bug and the fix for this will be included in the weekly patch release which is expected to be rolled out by the end of May, 2021. 
 
Please track the below feedback link to know the status of the issue.  
 
 
Please get back to us if you need further assistance. 
 
Regards, 
 
Sharon Sanchez S. 


Marked as answer
Loader.
Up arrow icon