Disabling the k-alt on a grid in MVC

[Ian]

Using the MVC wrapper I create the grid.

I need to tell the grid to not render the alternative style of alternating lines. Right now it adds a .k-alt to every other TR

Is this possible?

[Iliana Dyankova]

Hi Ian,

This is not supported out-of-the-box in Kendo UI Grid, however you could achieve it using:

• Additional JavaScript. For example in the dataBound event remove k-alt class using jQuery API:

  @(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()
      .Name("grid")
      //....
     .Events(ev => ev.DataBound("onDB"))
  )
  
  <script>
  function onDB() {
     $("#grid tr.k-alt").removeClass("k-alt");
  }
  </script>

• Custom CSS:

  <style>
  #grid tr.k-alt {
      background: transparent ;
  }
  </style>

Regards,
Iliana Nikolova
Telerik

[Ristogod]

I need the exact opposite of this. The alt color is light and my text readable. So when I remove the alt, every row is unreadable.

[Ristogod]

I was able to make mine work using the javascript method.

function dataBound(e) {
    $("#contacts tr").addClass("k-alt");
}

I would however prefer a CSS method that tells it to apply the k-alt class to all the rows that aren't k-alt class. I simply don't know how to do this, or even if it's possible.

[Ristogod]

I refined the jQuery a bit to only add it to rows that aren't already classed as k-alt:

function dataBound(e) {
     $("#contacts tr:not(.k-alt)").addClass("k-alt");
 }

[Iliana Dyankova]

Hi Nathan,

In order to change all grid rows color you could use the following CSS rule:

.k-grid tr {
   background-color: #fff; /* specify the background-color */
}

Regards,
Iliana Nikolova
Telerik

 

 

[SpicyMikey]

I've tried both of you solutions but neither do anything.  The alternating dark row still appears.  I need all rows to be the same color.  A row separator line is more than enough.   Any ideas?   This is an old thread and I'm using 2016 latest version kendo grid.  Thanks!

[Iliana Dyankova]

Hi Michael,

I tested both of the suggested solutions and they are working as expected (dojo). Could you please modify my example and demonstrate your exact setup - this way I would be able to provide concrete recommendations?

Regards,
Iliana Nikolova
Telerik by Progress

 

 

[SpicyMikey]

I've done more testing and generally got it to work. But I think the main problem is the way it plays with bootstrap themes, especially our "dark" themes. The alternating row colors are problematic among other things This question is becoming off scope but are there any papers in how to make kendo and bootstrap work tigether

[Iliana Dyankova]

Hi Michael,

The following documentation topic describes how to use the Kendo UI widgets alongside Twitter Bootstrap: 
http://docs.telerik.com/kendo-ui/third-party/using-kendo-with-twitter-bootstrap

Regards,
Iliana Nikolova
Telerik by Progress

 

 

[SpicyMikey]

Thanks.  This does indeed help.  Especially since my issues are with Grids and there is a good discussion on that in that document