Реализация слайдера в ASP.NET MVC?

Question

Я работаю в Slider Concept в ASP.NET MVC 2.

фрагмент кода слайдера

 <script type="text/javascript">
    $(function () {
        var abc = $('select#speed').selectToUISlider().next();
        fixToolTipColor();
    });
    function fixToolTipColor() {
        $('.ui-tooltip-pointer-down-inner').each(function () {
            var bWidth = $('.ui-tooltip-pointer-down-inner').css('borderTopWidth');
            var bColor = $(this).parents('.ui-slider-tooltip').css('backgroundColor')
            $(this).css('border-top', bWidth + ' solid ' + bColor);
        });
    }
</script>

 <form action="#">
<fieldset>
    <select name="speed" id="speed">
        <option value="Poor">Poor</option>
        <option value="Good">Good</option>
        <option value="Med">Med</option>
        <option value="VeryGood">VeryGood</option>
        <option value="Excellent">Excellent</option>
    </select>
</fieldset>
</form>

Я не понимаю, как загрузить слайдер с динамическими значениями (на основе расчетов или чисел из базы данных)

Как мне это сделать?

Сейчас я заполняю dropdownlist, используя следующий SQL. Как это можно использовать для заполнения слайдера?

 private void PopulateGradeScale(string tenantID)
    {
        List<scale> AttributesList = new List<scale>();
        if (!string.IsNullOrEmpty(tenantID))
        {
            Context.SetPrivilegeContext(PrivilegeConstant.ViewEmployee);
            Dictionary<string, scale> Attributes = Proxy.GetGrade(UserIdentity.TenantID);
            if (Attributes != null && Attributes.Count > 0)
            {
                AttributesList = Attributes.Values.ToList();
            }
        }
        if (!string.IsNullOrEmpty(tenantID))
            ViewData["Grade"] = new SelectList((IEnumerable)AttributesList, "Identifier", "Name");
        else
            ViewData["Grade"] = new SelectList((IEnumerable)AttributesList, "Identifier", "Name");
    }

Answer 1

Как всегда, вы начинаете с определения модели представления, которая будет представлять ваши данные для данного представления:

public class SliderViewModel
{
    public string SelectedSpeed { get; set; }
    public IEnumerable<Item> Items { get; set; }
}

public class Item
{
    public string Value { get; set; }
    public string Text { get; set; }
}

Далее у вас есть действие контроллера, которое будет использовать хранилище для запроса базы данных и заполнения модели представления, которая будет передана в строго типизированное представление:

public ActionResult Index()
{
    var model = new SliderViewModel
    {
        Items = new[]
        {
            new Item { Value = "Poor", Text = "Poor" },
            new Item { Value = "Good", Text = "Good" },
            new Item { Value = "Med", Text = "Med" },
            new Item { Value = "VeryGood", Text = "VeryGood" },
            new Item { Value = "Excellent", Text = "Excellent" }
        }
    };
    return View(model);
}

и, наконец, вы используете помощник HTML в представлении для генерации раскрывающегося списка ":

<%= Html.DropDownListFor(
    x => x.SelectedSpeed, 
    new SelectList(Model.Items, "Value", "Text")
) %>