Question

My ASP.NET MVC-3 application is using the previous version of Telerik MVC Extensions combobox. I am trying to change the style of an item in the list.

Here is the model:

public class Person
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public bool DisplayBold { get; set; }
        public string Value
        {
            get
            {
                return string.Format("{0}|{1}", this.Id, this.DisplayBold.ToString());
            }
        }
    }

The Controller:

var people = new List<Person>();
people.Add(new Person { Id = 1, Name = "John Doe", DisplayBold = true });
people.Add(new Person { Id = 2, Name = "Jayne Doe", DisplayBold = false });
ViewData["people"] = people;
return View();

The Combobox:

<% Html.Telerik().ComboBox()
   .Name("ComboBox")
           .BindTo(new SelectList((IEnumerable<Person>)ViewData["people"], "Id", "Name"))
           .ClientEvents(events => events
        .OnChange("ComboBox_onChange")
        .OnLoad("ComboBox_onLoad")
        .OnOpen("ComboBox_OnOpen"))
    .Render();
%>

I tried the following and it did change the first item:

var item = combobox.dropDown.$items.first();
item.addClass('test');

However when I tried to change the CSS when it is Ture:

var combobox = $(this).data('tComboBox');
$.each(combobox.dropDown.$items, function (idx, item) {
    if (combobox.data[idx].Value.split('|')[1] == 'True') {
        alert(item);
        $(item).addClass('test');

    }
});

It did not work!

Answer 1

This is the version after user373721 marked this as answered

While i was rewriting my previous answer and browsing the forums user373721 marked my old revision as answered.

I am sorry i searched the forum of telerik to see how you could hook into the databinding to influence the css. I could not find a good match to your problem.

One muddy workaround (getting desperated here) could be to add html to the names that should be displayed bold:

public class Person
{
    public string NameText { get; }
    {
        get
        {
            if(this.DisplayBold) {
                 return "<b>" + this.Name + "</b>";
            } else
                 return this.Name; 
        }
    }
}

So instead of binding to Name you would bind to NameText.
You may need to take care of html-conversion.

In my last search i found a post that may help. And now i found a post that could be from you

• By the way in the forums i have read that there were several bug
  fixes that could be important for your goal.
  Which telerik mvc-release are you using?