Are there any updates on this topic ? Since I am using Kendo UI slider with razor view having version 2017.2.621.545 and I am not able to get it works in mobile devices specially on iPhone.
The code is as follows -
@(Html.Kendo().SliderFor(m => m.PercentChanceClose)
.Name("PercentChanceClose")
.ShowButtons(true)
.Tooltip(true)
.Max(100)
.Min(0)
.SmallStep(5)
.LargeStep(10)
.Events( e => e.Change("SliderChange"))
.IncreaseButtonTitle("Perecent(%) Chance Close")
.HtmlAttributes(new { @class = "form-control"})
)
JavaScript function -
function SliderChange(e) {
if (e== null) {
SliderValue(50);
}
else {
SliderValue(e.value);
}
}
function SliderValue(x) {
var top = $("#PercentChanceClose").closest(".k-slider-wrap");
if (x >= 0 && x <= 24) {
$(".k-slider-track", top).css("background-color", "#00ff00");
$(".k-slider-selection", top).css("background-color", "#00ff00");
}
else if (x >= 25 && x <= 74) {
$(".k-slider-track", top).css("background-color", "#ffa500");
$(".k-slider-selection", top).css("background-color", "#ffa500");
}
else {
$(".k-slider-track", top).css("background-color", "#ff0000");
$(".k-slider-selection", top).css("background-color", "#ff0000");
}
}
10 Answers, 1 is accepted
I have tested the provided sample code with the latest version of the Kendo UI MVC wrappers (2018.2.620.545) and it seems to work as expected on my iPhone. Could you provide some more details what issues you are facing?
Regards,
Martin
Progress Telerik
Rank 1
I have tested with "2017.2.621.545" version as well and it is still looks fine on my device. Guessing from the images you sent, I suspect that some layout/styling settings might cause the problem. To further investigate on this issue we will need either a runnable project that we can debug locally, or at least a live URL where we can inspect the layout of the page.
Regards,
Martin
Progress Telerik
Rank 2
As stated in a previous post we can't confirm this behavior on our side neither with latest nor with the reported Kendo version. Please consider assembling a runnable demo that demonstrates the problem, and we will give our best to fix it as soon as possible.
Regards,
Martin
Progress Telerik
Rank 2
here is a Dojo example. Open it using an apple product and you will not see the slider anymore. Works fine on linux or PC environment.
https://dojo.telerik.com/@normpetroff/omAQObeV
Thank you for providing an isolated Dojo snippet. The issue is reproducible with it on our side.
After identifying the exact issue, I found out that we have it already logged, but its current title suggests it regards a very special case. As it turns out, the case is more general - having Slider inside Window and viewing them on iOS - screenshot. I increased issue's priority based on the two reports in this thread. And I will update the issue title and description to include this more general reproduction scenario. You may subscribe to this issue to receive updates on its progress. Currently there is no known workaround for it and if we find some, we will include it in the issue.
Regards,
Dimitar
Progress Telerik
After further issue isolation it turns out that it is reproducible only if kendo.mobile.all.min.css is loaded on the page. Without it the issue is not reproducible - Dojo.
Regards,
Dimitar
Progress Telerik
Rank 2
I need to use the kendo.mobile.all.min.css for switches that I have on the page. :(
I thank you for your update. I will subscribe and wait for a fix.
We have release a non-mobile Switch in R1 2019 - demos. It does not require mobile.css - Dojo
Regards,
Dimitar
Progress Telerik