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>'},
]
})},
});
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>'},
]
})},
});