sap.m.Table - 带有固定标题的垂直滚动 [英] sap.m.Table - Vertical Scrolling with Fixed Header
问题描述
我有一张包含大量数据的表.现在我想在固定表格标题的情况下垂直滚动.我能做到吗?
这是我的代码:
onInit: function() {var data = new JSONModel("Model/data.json");this.getView().setModel(data);var otable = this.getView().byId("PlaceIt");otable.bindItems("/employees", new ColumnListItem({细胞: [新文本({文字:{name}"}),新文本({文字:{物理}"}),新文本({文字:{化学}"}),新文本({文字:{数学}"}),新文本({文字:{英文}"})]}));otable.setModel(数据);var oScrollContainer = new ScrollContainer({高度:100px"，垂直:真实，可聚焦:真实，内容:[oTableItems]});},<列><列><Text text="学生姓名"/></列><列><Text text="物理"/></列><列><Text text="化学"/></列><列><Text text="数学"/></列><列><Text text="英文"/></列></列><!-- ... --></表>我尝试使用 sap.m.ScrollContainer 控件，但我什么也没得到.
这是一个
请注意，此功能仅受现代浏览器支持.
<小时>- 演示: https://jsbin.com/ticivew/edit?js，输出
- 属性描述
其他粘性选项v1.56 - 在 XMLView 中分配多个值的语法如下所示:
I have one table having lots of data. Now I want to scroll vertically with table header fixed. can I achieve this?
Here is my code:
onInit: function() {
var data = new JSONModel("Model/data.json");
this.getView().setModel(data);
var otable = this.getView().byId("PlaceIt");
otable.bindItems("/employees", new ColumnListItem({
cells: [
new Text({
text: "{name}"
}),
new Text({
text: "{Physics}"
}),
new Text({
text: "{Chemistry}"
}),
new Text({
text: "{Maths}"
}),
new Text({
text: "{English}"
})
]
}));
otable.setModel(data);
var oScrollContainer = new ScrollContainer({
height: "100px",
vertical: true,
focusable: true,
content: [oTableItems]
});
},
<Table id="PlaceIt">
<columns>
<Column>
<Text text="Student Name" />
</Column>
<Column>
<Text text="Physics" />
</Column>
<Column>
<Text text="Chemistry" />
</Column>
<Column>
<Text text="Maths" />
</Column>
<Column>
<Text text="English" />
</Column>
</columns>
<!-- ... -->
</Table>
I tried using sap.m.ScrollContainer control but I'm not getting anything.
Here is a demo.
解决方案 As of v1.54, the property sticky is publicly available.
sticky
Defines the section of the sap.m.Table control that remains fixed at the top of the page during vertical scrolling as long as the table is in the viewport.
Once its value is set to "ColumnHeaders", the headers will stay fixed while scrolling.
Be aware that this feature is supported only by modern browsers.
- Demo: https://jsbin.com/ticivew/edit?js,output
- Property description
Other sticky optionsv1.56 - The syntax for assigning multiple values in XMLView looks as follows:
<Table sticky="HeaderToolbar,InfoToolbar,ColumnHeaders">
这篇关于sap.m.Table - 带有固定标题的垂直滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
登录
关闭
扫码关注1秒登录
发送“验证码”获取
|
15天全站免登陆