Question

I am using .css file for the styles. In my view page i am having two list views and i want two different colours for two of the list views. How can i do that in kendo ui

Regards,

Sri

Answer 1

Prefix your CSS definition by listview id, discriminating between one and the other.

Given the HTML for the ListViews:

<div id="ListView1"></div>
<div id="ListView2"></div>

and a JavaScript:

$("#ListView1").kendoListView({
    dataSource: sharedDataSource,
    selectable: true,
    template: "<li>${title} ${year}</li>"
});
$("#ListView2").kendoListView({
    dataSource: sharedDataSource,
    selectable: true,
    template: "<li>${title} ${year}</li>"
});

The CSS definition would be something like:

#ListView1 .k-state-selected {
    background: red;
}
#ListView2 .k-state-selected {
    background: blue;
}