I have an index html page with a main grid that has a column
that is bound. This works....the user clicks...it routes correctly
to gotoView3. But I have a detail grid that is bound to this main
grid
and the exact same column template does not work. What
is the syntax to get this line to route correctly?
template: '<a href=x data-bind=\'click:
goToView3\' >#=Unit#</a>'
Here is the code
--------index.html------------------
<script id="index"
type="text/x-kendo-template">
<div
data-role="grid"
data-editable="false"
data-detail-init="viewModelIndex.mainDetailInit"
data-columns="[ { field: 'Fleet', title:
'Fleet', width: 80, template: '<a href=x data-bind=\'click:
goToView3\' >#=Fleet#</a>'} ]"
data-bind="source: dsFleets, events: { dataBound: dataBound }"
style="height: 400px">
</div>
</script>
---------viewmodel.js-----------------------
var viewModelIndex = kendo.observable({
goToView3: function(e) {
router.navigate("/ops?fleet=" +
e.data.FleetId);
e.preventDefault();
},
dsFleets: new kendo.data.DataSource({
data : [
{
FleetId :
"1",
},
{
FleetId :
"2",
},
],
schema: {
model: {
fields: {
FleetId: { type:
"string" },
}
}
}
}),
mainDetailInit: function (e) {
$("<div/>").appendTo(e.detailCell).kendoGrid({
dataSource:
{
data: [
{
FleetId
:
"1",
Unit
: "P0014",
},
{
FleetId
:
"1",
Unit
: "P0015",
}
],
schema: {
model: {
fields:
{
FleetId:
{ type: "string" },
Unit:
{ type: "string" },
}
}
},
pageSize: 20,
filter: { field: "FleetId", operator: "eq", value:
e.data.FleetId }
},
scrollable:
false,
columns:
[
{
field: "Unit", title: "Unit", width: 200, template: '<a
href=x data-bind=\'click: goToView3\'
>#=Unit#</a>'},
]
})},
});