Hello, i'm new, how can i enable Header filtering in a Row Template grid.
I'm using, an exemple i found in this forum ....
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="styles/kendo.common.min.css" rel="stylesheet" />
<link href="styles/kendo.default.min.css" rel="stylesheet" />
<script src="js/jquery.min.js"></script>
<script src="js/kendo.all.min.js"></script>
</head>
<body>
<div id="example" class="k-content">
<table id="grid">
<colgroup>
<col class="photo" />
<col class="details"/>
<col/>
</colgroup>
<thead>
<tr>
<th>
Picture
</th>
<th>
Details
</th >
<th data-field="EmployeeID">
ID
</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3"></td>
</tr>
</tbody>
</table>
<script id="rowTemplate" type="text/x-kendo-tmpl">
<tr>
<td class="photo">
image
</td>
<td class="details">
<span class="title">#: Title #</span>
<span class="description">Name : #: FirstName# #: LastName#</span>
<span class="description">Country : #: Country# </span>
</td>
<td class="employeeID">
#: EmployeeID #
</td>
</tr>
</script>
<style scoped>
.photo {
width: 140px;
}
.details {
width: 400px;
}
.title {
display: block;
font-size: 1.6em;
}
.description {
display: block;
padding-top: 1.6em;
}
.employeeID {
font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
font-size: 50px;
font-weight: bold;
color: #898989;
}
td.photo, .employeeID {
text-align: center;
}
.k-grid-header .k-header {
padding: 10px 20px;
}
.k-grid td {
}
</style>
</div>
</body>
</html>
I'm using, an exemple i found in this forum ....
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="styles/kendo.common.min.css" rel="stylesheet" />
<link href="styles/kendo.default.min.css" rel="stylesheet" />
<script src="js/jquery.min.js"></script>
<script src="js/kendo.all.min.js"></script>
</head>
<body>
<div id="example" class="k-content">
<table id="grid">
<colgroup>
<col class="photo" />
<col class="details"/>
<col/>
</colgroup>
<thead>
<tr>
<th>
Picture
</th>
<th>
Details
</th >
<th data-field="EmployeeID">
ID
</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3"></td>
</tr>
</tbody>
</table>
<script id="rowTemplate" type="text/x-kendo-tmpl">
<tr>
<td class="photo">
image
</td>
<td class="details">
<span class="title">#: Title #</span>
<span class="description">Name : #: FirstName# #: LastName#</span>
<span class="description">Country : #: Country# </span>
</td>
<td class="employeeID">
#: EmployeeID #
</td>
</tr>
</script>
<style scoped>
.photo {
width: 140px;
}
.details {
width: 400px;
}
.title {
display: block;
font-size: 1.6em;
}
.description {
display: block;
padding-top: 1.6em;
}
.employeeID {
font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
font-size: 50px;
font-weight: bold;
color: #898989;
}
td.photo, .employeeID {
text-align: center;
}
.k-grid-header .k-header {
padding: 10px 20px;
}
.k-grid td {
}
</style>
</div>
</body>
</html>