我需要在表中实现更多动态值加载。这是我的屏幕。
最初,我已经显示了api调用中的值。到那时,我的表格应自动向下滚动到表格的最后一行。然后,我再次单击api调用load more按钮,并在模型中添加了新值,并将其也添加到了表中。但是它不会向下滚动到表格。这是我尝试向下滚动的控制器代码。
var oTableModel = new sap.ui.model.json.JSONModel();
oTableModel .setSizeLimit(TABLE_ARRAY.length);
oTableModel .setData({
oset: TABLE_ARRAY
});
that.getView().byId("oSmartTable").setModel(oTableModel);
//that.getView().byId("otable").getBinding("items").refresh();
var oTable = that.getView().byId("logtable");
var oLength = TABLE_ARRAY.length - 1;
//New Item that is added
var oItem = oTable.getItems()[oLength];
var oScroll = that.getView().byId("oscroll");
//Add Delay since the new item needs to be added to the HTML Doc
jQuery.sap.delayedCall(100, that, function () {
//Scroll to the newly added item
oScroll.scrollToElement(oItem);
});
这是智能表的view.xml代码
<ScrollContainer id="oscroll" height="100%" width="99%" horizontal="false" vertical="true">
<VBox class="chartBackground" alignItems="Stretch" width="100%" id="logTableVB">
<items>
<smartTable:SmartTable id="oSmartTable" entitySet="oset" smartFilterId="smartFilterBar" tableType="ResponsiveTable"
app:p13nDialogSettings="{sort:{items:[{ columnKey: 'Type', operation: 'Ascending' }]}}" useExportToExcel="false"
beforeExport="onBeforeExport" useVariantManagement="true" useTablePersonalisation="true" showTablePersonalisation="true"
header="Total Logs " showRowCount="true" showFullScreenButton="true" enableAutoBinding="true">
<Table id="logtable" sticky="ColumnHeaders" class="headercolor" growingScrollToLoad="true" growing="true" growingThreshold="50">
<!--firstVisibleRowChanged="scroll"-->
<columns getResizable="true">
<Column minScreenWidth="Tablet" demandPopin="true" width="10%">
<customData>
<core:CustomData key="p13nData"
value='\{"sortProperty": "c1_data", "filterProperty": "c1_data","columnKey": "Column 1", "leadingProperty" : "c1_data"}'/>
</customData>
<Text class="headercolor" text="Column 1"/>
</Column>
<Column minScreenWidth="Tablet" demandPopin="true" width="15%">
<customData>
<core:CustomData key="p13nData"
value='\{"sortProperty": "c2_data", "filterProperty": "c2_data","columnKey": "Column 2", "leadingProperty" : "c2_data"}'/>
</customData>
<Text class="headercolor" text="Column 2"/>
</Column>
<Column minScreenWidth="Tablet" demandPopin="true" width="15%">
<customData>
<core:CustomData key="p13nData"
value='\{"sortProperty": "c3_data", "filterProperty": "c3_data","columnKey": "Column 3", "leadingProperty" : "c3_data"}'/>
</customData>
<Text class="headercolor" text="Column 3"/>
</Column>
<Column minScreenWidth="Tablet" demandPopin="true" width="15%">
<customData>
<core:CustomData key="p13nData"
value='\{"sortProperty": "c4_data", "filterProperty": "c4_data","columnKey": "Column 4", "leadingProperty" : "c4_data"}'/>
</customData>
<Text class="headercolor" text="Column 4"/>
</Column>
<Column minScreenWidth="Tablet" demandPopin="true" width="15%">
<customData>
<core:CustomData key="p13nData"
value='\{"sortProperty": "c5_data", "filterProperty": "c5_data","columnKey": "Column 5", "leadingProperty" : "c5_data"}'/>
</customData>
<Text class="headercolor" text="Column 5"/>
</Column>
<Column minScreenWidth="Tablet" demandPopin="true">
<customData>
<core:CustomData key="p13nData"
value='\{"sortProperty": "c6_data", "filterProperty": "c6_data","columnKey": "Column 6", "leadingProperty" : "c6_data"}'/>
</customData>
<Text class="headercolor" text="Column6"/>
</Column>
</columns>
<items>
<ColumnListItem type="Active" press="onLogTableClick_">
<cells>
<Text class="tabletext" text="{c1_data}"/>
<Text class="tabletext" text="{c2_data}"/>
<Text class="tabletext" text="{c3_data}"/>
<Text class="tabletext" text="{c4_data}"/>
<Text class="tabletext" text="{c5_data}"/>
<Text class="tabletext" text="{c6_data}"/>
</cells>
</ColumnListItem>
</items>
</Table>
<HBox>
<items>
<HBox class="contactMarigin" width="100%" justifyContent="Start" alignItems="Center">
<items></items>
</HBox>
<HBox class="contactMarigin" width="100%" justifyContent="Center" alignItems="Center">
<items></items>
</HBox>
<HBox class="contactMarigin" width="100%" justifyContent="End" alignItems="Center">
<items>
<Button id="oload_more" text="Load More" class="pdfMarigin" />
</items>
</HBox>
</items>
</HBox>
</smartTable:SmartTable>
</items>
</VBox>
</ScrollContainer>
我已将智能表放入滚动容器中。当我单击“加载更多”按钮时,应该自动向下滚动到最后一行。我该如何实现?预先感谢。
答案 0 :(得分:0)
setTimeout(function () {
oScroll.scrollToElement(oTable.getItems()[oLength], 800);
}, 0);