2016-12-06 45 views
0

我已經實現了sap.m.Table,但沒有顯示所有記錄。也似乎沒有滾動的選項。 我經歷了api這表明使用越來越多的越來越多的閾值grow.scrollToLoad的sap.m.ListBase。如何啓用sap.m.Table在sapui5中滾動?

這裏增長將使表控制裝載更多的物品,growingThreshold將決定項目的數量從模型中的每個成長和getGrowingScrollToLoad請求將使用戶通過記錄滾動,而不是顯示「更多」按鈕來加載更多數據。

但即使使用這些屬性後,我的整個數據仍然沒有得到渲染,我可以看到更多的按鈕,而不是滾動條。在「更多」按鈕下面,我可以看到一個數字,它確定了要呈現的記錄的整個數量以及在初始視圖中呈現的記錄數量。

如果數據超出頁面的限制,不應該將滾動作爲默認選項嗎?我很困惑。請幫忙。

此外,我也通過this發佈! :)

+0

嘗試點擊「更多」按鈕,它不會加載更多的數據到表? – Jaro

+0

hi @Jaro不,它不會加載整個數據。只有可以在頁面 – d33a

+0

上顯示的數據可能是基於您的父容器發生的。如果使用'layout:fixContent'作爲容器,則表的滾動行爲可能會受到影響。 – Andreas

回答

0

默認情況下,如果在sap.m.Table有更多的行,滾動將在那裏。 你可以看到working example here

但是,如果要強制固定行的知名度,你可以使用sap.ui.table.Table與性能visibleRowCountminAutoRowCount

另請注意,如果垂直滾動條對sap.m.Table不可見,請檢查是否有其他css正在重寫樣式。否則,您可以使用完整的UI代碼將代碼粘貼到問題中。

1

考慮的問題是如何精美的設置,與選項:

  1. sap.ui.table.Table:滾動固定頭。
  2. sap.m.Table:增長列表,srcollable沒有固定標題。

但很多時候,我們需要一個sap.m.Table-滾動的,但與靜態頭,所以下面的表格內容不低於進一步移動。以下代碼將在此期間提供幫助。它有一個固定標題的可滾動身體。

設置:我使用兩個sap.m.Table實例,一個只是頭和其他僅用於數據。另外,我正在使用一個可滾動的容器,它包含第二個表格(不包含標題)。由於Scrollable容器的固定寬度,我們看到一個滾動條。僞代碼下面提供:

view.xml用:

<Table showNoData='false'> 
      <columns> 
       <Column> 
        <header> 
         <Text text='ID' /> 
        </header> 
       </Column> 
       <Column> 
        <header> 
         <Text text='First Name' /> 
        </header> 
       </Column> 
       <Column> 
        <header> 
         <Text text='Last Name' /> 
        </header> 
       </Column> 
       <Column> 
        <header> 
         <Text text='Gender' /> 
        </header> 
       </Column> 
      </columns> 
     </Table> 
     <ScrollContainer height='20rem' vertical='true'> <!-- To have fixed with and enable vertical scrolling of data table --> 
     <!-- Table to hold data, data ,data --> 
      <Table class='tableHdr' items='{/}'> <!-- CSS class to hide the column header, otherwise we will have 2 headers. --> 
       <columns> 
       <!-- Dont need columns header, as upper table has already defined them. --> 
        <Column > 
        </Column> 
        <Column > 
        </Column> 
        <Column > 
        </Column> 
        <Column > 
        </Column> 
       </columns> 
       <items> 
        <ColumnListItem> 
         <cells> 
          <Text text='{id}' /> 
          <Text text='{first_name}' /> 
          <Text text='{last_name}' /> 
          <Text text='{gender}' /> 

         </cells> 
        </ColumnListItem> 
       </items> 
      </Table> 
     </ScrollContainer> 

現在,如果你沒有這個執行以下樣式類上面的代碼,你會從2個表結束了2列標頭。所以,要刪除第二列標題,我使用了下列類別:

.tableHdr .sapMListTblHeaderCell { 
      padding: 0rem; 
} 

想聽聽對此的反饋。