Book Image

Kendo UI Cookbook

By : Sagar Ganatra
Book Image

Kendo UI Cookbook

By: Sagar Ganatra

Overview of this book

Table of Contents (18 chapters)
Kendo UI Cookbook
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Customizing the look and feel of the Grid


In this recipe, we will look at how we can customize the look and feel of the rows by using a template. We will also look at the reordering and resizing of columns in the Grid.

How to do it…

Each record in the DataSource object will be represented by a table row (the tr element) in the Grid. These rows can be customized by providing a template to the rowTemplate and altRowTemplate attributes. The rowTemplate and altRowTemplate attributes are used to style the rows in the Grid. Let's first define these templates. The following code snippet is the template for rowTemplate:

<script id="gridRowTemplate" type="text/x-kendo-tmpl">
  <tr>
    <td class="details">
      <span class="movieName"><h3>#: movieName #</h3></span>
      <span class="rating">Rating : #: rating#</span>
    </td>
    <td class="year">
      <h3>#: year #</h3>
    </td>
  </tr>
</script>

The...