剑道组合框不同的CSS替代项目答案

【问题标题】：kendo combobox different css for alternative items剑道组合框不同的CSS替代项目
【发布时间】：2014-08-26 16:43:09
【问题描述】：

我有一个 mvc kendo CombBox 声明为

var comboBox = Html.Kendo().ComboBox()
         .Name("Combo")
         .Placeholder("Select a val...")
         .DataTextField("Description")
         .DataValueField("Description")
         .AutoBind(false)
         .Filter(FilterType.Contains)
         .DataSource(source => source
             .Read(read => read.Action("XYZ", "ABC").Data("callList"))
             .ServerFiltering(true)
             )
         .HtmlAttributes(new { style = "width:400px" });

有没有办法让替代项目有不同的 css。

我在剑道文档中找不到任何东西。我也尝试过使用 JQuery，但失败了。谁能告诉我是否有解决方案。

谢谢。

【问题讨论】：

标签： kendo-ui kendo-asp.net-mvc kendo-combobox

【解决方案1】：

根据您的浏览器支持（IE9 或更高版本），您可以使用普通的旧 CSS 执行此操作。

#Combo .k-item:nth-child(odd) {
    background-color: #f00;
}

【讨论】：

我认为这不起作用，因为选项列表不是#Combo 的子项。这个想法很好，但是将其限制为单个元素的方法行不通。
我试过你的答案，但没有奏效。感谢您的尝试。
我认为如果下拉菜单是从现有元素创建的，那么它可以工作，否则 Kendo 似乎会将它们移到自己的下拉面板中。可能有一种方法可以通过 JS 获取该元素。

【解决方案2】：

试试这个方法。

$(document).ready(function () {
        $("#States").kendoComboBox();
        var cmb = $("#States").data("kendoComboBox");

        cmb.ul.find("li:odd").css("background-color", "#C0C0C0");
        cmb.ul.find("li:odd").css("background-color", "#FFFFFF");
    });

检查这个剑道道场http://dojo.telerik.com/ePIQu 我使用的是 Kendo Web 而不是 MVC，但只要在填充网格后运行此脚本，结果就会相同。

【讨论】：