在右侧,我想找到所需的行并将其显示在顶部部分,下面是我的代码:
var oSplitterV = new sap.ui.commons.Splitter();
oSplitterV.setSplitterOrientation(sap.ui.commons.Orientation.vertical);
var oModel = new sap.ui.model.json.JSONModel();
oModel.loadData("HelpData.json","",false);
//below is the code for left part
var oLinkTemplate = new sap.ui.commons.Link({
text:"{name}",
press: oController.doPress
});
var oPanel = new sap.ui.commons.Panel({text:"Title"});
var oLayout = new sap.ui.layout.VerticalLayout({
content:{
path:"/document",
template:oLinkTemplate
}
});
oLayout.setModel(oModel);
oPanel.addContent(oLayout);
oSplitterV.addFirstPaneContent(oPanel);
//below is the code for right part
var oRowRepeater = new sap.ui.commons.RowRepeater({
numberOfRows:1000
});
oRowRepeater.setModel(oModel);
var oRowTemplate = new sap.ui.layout.VerticalLayout();
oRowTemplate.addContent(new sap.ui.commons.TextView({
text:"{name}",
}));
oRowTemplate.addContent(new sap.ui.commons.FormattedTextView({
htmlText:"{description}"
}));
oRowRepeater.bindRows("/document", oRowTemplate);
oSplitterV.addSecondPaneContent(oRowRepeater);
另请参阅JSFiddle code这里。在 doPress 函数中,我可以获取我单击的链接的名称值,但我不知道如何获取相应的内容并将其显示在第二个 Pane 内容的顶部部分(它有点像 anchor ),请帮助我,谢谢你。
最佳答案
在 onPress 事件处理程序中,您可以查询底层绑定(bind)以确定选择了哪个元素。
一旦你有了这个,你就可以获得对 RowRepeater 中相应行的 jQuery 引用,并使用 jQuery 的滚动功能:
press: function(e) {
var
// get the binding path so we can look
// up the corresponding RowRepeater row
sPath=e.oSource.getBindingContext().getPath(),
// parse out the binding path number
iPath=Number(sPath.match(/.*(\d)$/)[1]),
// get the px value of the top of the
// corresponding RowRepeater row using the binding path
iScrollTop=oRowRepeater.getRows()[iPath].$().offset().top;
// smoothly scroll to row
$('html, body').animate({
scrollTop: iScrollTop
}, 1000);
}
这可能需要一些清理,但可以提供一个起点:
关于javascript - 如何在控件容器中找到SAPUI5控件并将其显示在顶部部分?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33932272/