你好kendo listview支持详细模板或不喜欢kendo Grid。如果不是我如何使用kendo listview实现详细模板。
此致
答案 0 :(得分:1)
答案 1 :(得分:1)
Kendo Ui Listview不支持详细信息模板,但可以使用相同的用户
界面自定义kendo Gridview详细信息模板。
这里是简单的代码:
<div id="listView"></div>
<script type="text/x-kendo-template" id="template">
<div style="height:150px;width:30%;float:left;background-color:gray">
</div>
<div style="width:65%;float:left" class="customGrid"></div>
</script>
this.List = $("#listView").kendoGrid({
dataSource: [{ Id: 1, Name: 'A' }, { Id: 2, Name: 'B' }, { Id: 3, Name: 'C' }, { Id: 4, Name: 'D' }],
detailTemplate: kendo.template($("#template").html()),
detailInit: detailInit,
scrollable:false
}).data('kendoGrid');
var selectTr;
function detailInit(e) {
alert(e.data.Id);
var detailRow = e.detailRow;
var gg = detailRow.find(".customGrid").kendoGrid({
dataSource: [{ Id: 1, Name: 'A' }, { Id: 2, Name: 'B' }, { Id: 3, Name: 'C' }, { Id: 4, Name: 'D' }],
scrollable: false,
selectable: 'row',
change: function () {
selectTr = this.select();
console.log(selectTr.closest('.customGrid').data('grid').dataItem(selectTr));
}
}).data('kendoGrid');
detailRow.find(".customGrid").data('grid', gg);
}