data-pageable'属性不将记录拆分为页
kendo grid 'data-pageable' attribute not splitting records into pages
我有一个剑道网格，我绑定到剑道。可观测视图模型。网格(如下所示)具有该属性data-pageable='{ "pageSize": 10 }'
这不起作用，所有记录(2000左右)都在第一页。在我的应用程序中有其他kendo网格，它们的结构几乎相同，并且分页工作(我已经展示了一个分页在底部工作的页面示例)
这是不工作的网格(没有分页):
<div id="PatrolRecords">
<div data-filterable='{ "mode": "row" }'
data-role='grid'
data-sortable='true'
data-detail-template='patrolDetailTemplate'
data-detail-init='detailInit'
data-bind='source: reportData, events: {excelExport: excelExportHandler}'
data-pageable='{ "pageSize": 10 }'
data-toolbar='["excel"]'
data-excel='{ "fileName": "Patrols.xlsx", "allPages": "true" }'
data-columns='[
{
field: "patrol_id_plain",
title: "Patrol ID",
filterable: false,
width: 70
},
{
field: "tour_name",
title: "Tour",
filterable: { cell: { operator: "contains" } }
},
{
field: "location_name",
title: "Location",
filterable: { cell: { operator: "contains" } }
},
{
field: "client_company",
title: "Company",
filterable: { cell: { operator: "contains" } }
},
{
field: "address",
title: "Address",
template: kendo.template($("#addressTemplate").html()),
filterable: { cell: { operator: "contains" } }
},
{
field: "end_date_seconds",
title: "Date & Time",
template: kendo.template($("#dateTemplate").html()),
filterable: false
},
{
field: "patrolled_by",
title: "Patrolled By",
filterable: { cell: { operator: "contains" } }
},
{
field: "checkpoints",
title: "Checkpoints",
template: kendo.template($("#checkpointsTemplate").html()),
filterable: false,
width: 90
},
{
field: "incident_count",
title: "Incidents",
filterable: false,
width: 70
},
{
title: "GPS",
template: kendo.template($("#gpsTemplate").html()),
filterable: false,
width: 50
},
{
title: "",
template: kendo.template($("#viewLinkTemplate").html()),
filterable: false,
width: 60
},
]'>
</div>
</div>
<script type="text/x-kendo-template" id="dateTemplate">
${end_date}
</script>
<script type="text/x-kendo-template" id="patrolDetailTemplate">
<div class="container">
</div>
</script>
<script type="text/x-kendo-template" id="viewLinkTemplate">
<a href="/patrol/patrol.aspx?r=1&p=${patrol_id}" target="_blank">View</a>
</script>
<script type="text/x-kendo-template" id="gpsTemplate">
# if((longitude && latitude) || Number(checkpoint_gps_count) > 0) { #
<a href="''#" onclick="javascript: OpenWindow('/patrol/gpsmap.aspx?p=${patrol_id}', 'gps_map', 750, 550); return false;"><img style="border:0px;" src="/images/icons/gps.gif"></a>
# } else { #
-
# } #
</script>
<script type="text/x-kendo-template" id="checkpointsTemplate">
# if(incident_only == "1") { #
-
# } else { #
${completed_checkpoint_count} of ${total_checkpoint_count}
# } #
</script>
<script type="text/x-kendo-template" id="addressTemplate">
# if(address) { #
# address = address.trim(); #
${address}<br/>
# } #
# if(city) { #
# city = city.trim(); #
${city},
# } #
# if(abbreviation) { #
# abbreviation = abbreviation.trim(); #
${abbreviation}
# } #
</script>
<script type="text/x-kendo-template" id="patrolUserTemplate">
# if(first_name) { #
# first_name = first_name.trim(); #
${first_name}
# } #
# if(last_name) { #
# last_name = last_name.trim(); #
${last_name}
# } #
</script>
<script type="text/x-kendo-template" id="geotagTemplate">
# if(barcode) { #
# if(barcode_scanned == "1") { #
<span style="color:''#009900;">Scanned</span>
# } else if(barcode_required == "1") { #
<span style="color:''#FF0000;">Not scanned - Overridden</span>
# } else { #
<span style="color:''#FF0000;">Not scanned</span>
# } #
# } else { #
N/A
# } #
</script>
<script type="text/x-kendo-template" id="geofenceTemplate">
# if(geofence_enabled == "1") { #
# if(!latitude || !longitude) { #
<span style="color:''#FF0000;">No GPS</span>
# } else if(Number(geofence_distance) > Number(geofence_radius)) { #
<span style="color:''#FF0000;">Outside (${geofence_distance} feet from center)</span>
# } else { #
<span style="color:''#009900;">Inside (${geofence_distance} feet from center)</span>
# } #
# } else { #
N/A
# } #
</script>
<script type="text/x-kendo-template" id="completedTemplate">
# if(completed_date) { #
${completed_date}
# } else { #
<span style="color:''#FF0000;">Not Completed</span>
# } #
</script>
<script type="text/x-kendo-template" id="gpsTemplateCheckpoint">
# if(latitude && longitude){ #
<a href="''#" onclick="javascript: OpenWindow('/patrol/gpsmap.aspx?ptc=${ptc_id}', 'gps_map', 750, 550); return false;"><img style="border:0px;" src="/images/icons/gps.gif"></a>
# } else { #
N/A
# } #
</script>
<script type="text/x-kendo-template" id="patrolledByTemplate">
# if(!first_name && !last_name) { #
n/a
# } else { #
# if(first_name) { #
# first_name = first_name.trim(); #
${first_name}
# } #
# if(last_name) { #
# last_name = last_name.trim(); #
${last_name}
# } #
# } #
</script>
<script type="text/javascript">
function createLocationDropdownlist(args) {
createDropdownlistFilter(args, viewModel.reportData.PatrolDurations, "location_name");
}
function detailInit(e) {
e.detailRow.find(".container").kendoGrid({
dataSource: e.data.CheckpointRecord,
columns: [
{
field: "checkpoint_name",
title: "Checkpoint"
},
{
field: "patrolled_by",
title: "Patrolled By"
},
{
field: "geotag",
title: "GeoTag",
template: kendo.template($("#geotagTemplate").html())
},
{
field: "geofence",
title: "GeoFence",
template: kendo.template($("#geofenceTemplate").html())
},
{
field: "completed_date",
title: "Completed",
template: kendo.template($("#completedTemplate").html())
},
{
field: "gps",
title: "GPS",
template: kendo.template($("#gpsTemplateCheckpoint").html())
}
]
});
}
</script>
下面是在另一个页面上运行的类似网格(每页10条记录)
<div id="CustomFormLocationRecords">
<div data-filterable='{ "mode": "row" }'
data-role='grid'
data-sortable='true'
data-detail-template='locationDetailTemplate'
data-detail-init='detailInit'
data-bind='source: reportData.CustomFormPerLocation, events: {excelExport: excelExportHandler}'
data-pageable='{ "pageSize": 10 }'
data-toolbar='["excel"]'
data-excel='{ "fileName": "CustomFormPerLocation.xlsx", "allPages": "true" }'
data-columns='[
{
"field": "location_name",
"title": "Location",
"filterable": {
cell: {
template: createLocationDropdownlist,
showOperators: false
}
}
},
{
"field": "client_name",
"title": "Client",
"filterable": false
},
{
"field": "patrol_count",
"title": "Patrols",
"filterable": false
},
{
"field": "form_count",
"title": "Forms",
"filterable": false
}
]'>
</div>
</div>
<script type="text/x-kendo-template" id="locationDetailTemplate">
<div class="container">
</div>
</script>
<script type="text/x-kendo-template" id="patrolUserTemplate">
# if(first_name) { #
# first_name = first_name.trim(); #
${first_name}
# } #
# if(last_name) { #
# last_name = last_name.trim(); #
${last_name}
# } #
</script>
<script type="text/x-kendo-template" id="viewFormLinkTemplate">
<a href="/forms/formsubmission.aspx?r=1&ptc=${ptc_id}" target="_blank">View Form</a>
</script>
<script type="text/x-kendo-template" id="viewPatrolLinkTemplate">
<a href="/patrol/patrol.aspx?r=1&p=${patrol_id}" target="_blank">View Patrol</a>
</script>
<script type="text/javascript">
function createLocationDropdownlist(args) {
createDropdownlistFilter(args, viewModel.reportData.CustomFormPerLocation, "location_name");
}
function detailInit(e) {
e.detailRow.find(".container").kendoGrid({
dataSource: e.data.CustomFormRecord,
columns: [
{
field: "form_name",
title: "Form"
},
{
field: "completed_date",
title: "Date"
},
{
field: "patrol_user",
title: "Patrolled By",
template: kendo.template($("#patrolUserTemplate").html()),
filterable: { cell: { operator: "contains" } }
},
{
title: "",
template: kendo.template($("#viewFormLinkTemplate").html()),
filterable: false,
width: 90
},
{
title: "",
template: kendo.template($("#viewPatrolLinkTemplate").html()),
filterable: false,
width: 90
}
]
});
}
</script>
原来pagesize选项应该在数据源上设置(当它被传递给网格时)，而不是声明性网格初始化。
viewModel = kendo.observable({
reportData: new kendo.data.DataSource({
data: results.Patrols,
schema: {
model: {
fields: {
incident_count: { type: "number" },
end_date_seconds: { type: "number" },
patrol_id_plain: { type: "number" }
}
}
},
pageSize: 10
})
});
相关文章：
- 使用Dnamics CRM 2011中的JavaScript读取子网格的所有记录，而不考虑活动页面
- 拆分单词jquery
- 拆分文本以每隔n个字符添加一行新行，并注意空格
- AngularJs对所有页面中的所有记录进行排序
- 有没有一种方法可以在控制台关闭的情况下让console.log(）在IE中记录消息
- window.location替换并传递URL历史记录条目中的变量
- 将字符串拆分为数组时出现JavaScript错误
- Javascript历史记录转换为php行
- 在JavaScript中拆分日期字符串的更好方法是什么
- JavaScript，PHP-用JavaScript将多个数据库记录发送到变量或表
- webpack代码拆分了handlerbs文件——结果是文件很大
- 猫鼬在特定记录中查找嵌套记录
- 浏览器何时记录历史记录
- 如何将字符串拆分为字符，但在javascript中保留空格
- 简单地将拆分变量添加到对象中
- 将一个表的id与另一个表中的user_id进行匹配，以获取mysql中的记录
- 更新成员数据模型中的记录列表
- 换行符拆分返回“”;未定义”;
- 如何使用提交按钮搜索表中的记录
- 将SQL查询返回的记录拆分为一个数组
