Issue with slider in an edit template

[oliwa]

I have a grid that has a decimal column.  When a user edits a row in the grid I would like the slider to be used as the editor.  I can get that to work and to populate but what I can't get to populate is a div that shows the current value.  If I take the slider out it works.

First I fill the grid with some numbers...

[GridAction]
public ActionResult GetGridData()
{
    var list = new List<TrainingViewModel>();

    for (decimal i = 0; i < 5; i = i + .25m)
    {
        list.Add(new TrainingViewModel { Hours = i });
    }

    return View(new GridModel(list));
}

And then I use the same example from the Telerik library...

<div>

@(Html.Telerik().SliderFor(model => model.Hours)
    .TickPlacement(SliderTickPlacement.None)
    .Min(.25m)
    .Tooltip(tooltip => tooltip.Enabled(true))
    .Max(10)
    .SmallStep(0.25m)
    .HtmlAttributes(new { style = "width:250px;" })
    .Value(Model.Hours)
    .ClientEvents(events => events
        .OnSlide("onChange")
        .OnChange("onChange")
    )
)

</div>

<div>
    <div id="currentValueDiv" class="t-widget" style="width:40px; height:20px; line-height:20px; text-align:center;">
        @Model.Hours
    </div>
</div>

The div updates when you drag the slider but on initial population the div does not show the value being edited.

Thanks

[Petur Subev]

Hello Brian,

 
Thank you for sending us sample of your scenario.
When using Ajax binding you can not use the @Model in the template. The slider is rendered only once on the server and it is being updated on the client side via our scripts.
In order to make things work in your scenario, you can hook a handler to the OnEdit client event of the Grid and update the HTML of your container with the value of the Slider (which is updated properly).
For your convenience I attached a modified version of your project.

Kind regards,
Petur Subev
the Telerik team