테이블 머리글 그룹화 방법 - SAPUI5 xml

Question

SAPUI5 XML을 사용하여 테이블에 여러 헤더가 있어야합니다.

이것은 내가 시도한 것입니다. JsBin

<table:Table title="Real-time order status" noDataText="No data to display" id="tableDisp" enableBusyIndicator="true" showNoData="true" width="auto" class="sapUiResponsiveMargin"> 
            <table:Column id="col6" hAlign="Center" headerSpan="[2,1]"> 
        <table:multiLabels> 
         <Label text="2 - Batch records handed over to QA" class="tableHeaderWrap"/> 
         <Label text="Target" textAlign="Center" /> 
        </table:multiLabels> 
        <table:template> 
         <Label text="{Target}"/> 
        </table:template> 
       </table:Column> 
       <table:Column id="col10" hAlign="Center"> 
        <table:multiLabels> 
         <Label text="2 - Batch records handed over to QA" class="tableHeaderWrap"/> 
         <Label text="Actual" textAlign="Center"/> 
        </table:multiLabels> 
        <table:template> 
         <Label text="{Actual}"/> 
        </table:template> 
       </table:Column> 

은 내가해야 할 것은 - 지금 당신이 시도 무엇

Answer 1

이 괜찮습니다. 그러나 배열 대신 헤더 스팬을 추가하면 아래의 그림과 같이 2가 주어집니다. thread을 볼 수 있습니다.

이 답변은 jsbin에있는 데이터입니다.

<Page title="{i18n>title}"> 
    <content> 
     <table:Table title="Real-time order status" noDataText="No data to display" id="tableDisp" enableBusyIndicator="true" showNoData="true" width="auto" class="sapUiResponsiveMargin"> 
      <table:Column id="col6" headerSpan="2" colspan="2"> 
       <table:multiLabels > 
        <Label text="Batch records" textAlign="Center" width="100%"/> 
        <Label text="Target" textAlign="Center" width="100%"/> 
       </table:multiLabels> 
       <table:template> 
        <Text text="Target"/> 
       </table:template> 
      </table:Column> 
      <table:Column id="col10"> 
       <table:multiLabels> 
        <Label text="Batch records" textAlign="Center"/> 
        <Label text="Actual" textAlign="Center" width="100%"/> 
       </table:multiLabels> 
       <table:template> 
        <Text text="Actual"/> 
       </table:template> 
      </table:Column> 
     </table:Table> 
    </content> 
</Page> 

또는 컨트롤러에서 ID로 열을 가져와야하고 헤더 팬을 설정해야합니다. 당신의 위의 코드에 대한

는 폭, "textAlign과"를 추가하고 아래로 headerSpan 속성을 변경

<table:Table title="Real-time order status" noDataText="No data to display" id="tableDisp" enableBusyIndicator="true" showNoData="true" width="auto" class="sapUiResponsiveMargin"> 
    <table:Column id="col6" hAlign="Center" headerSpan="2"> 
    <table:multiLabels> 
     <Label text="2 - Batch records handed over to QA" textAlign="Center" width="100%" class="tableHeaderWrap"/> 
     <Label text="Target" textAlign="Center" width="100%" /> 
    </table:multiLabels> 
    <table:template> 
     <Label text="{Target}"/> 
    </table:template> 
    </table:Column> 
    <table:Column id="col10" hAlign="Center"> 
    <table:multiLabels> 
     <Label text="2 - Batch records handed over to QA" textAlign="Center" width="100%" class="tableHeaderWrap"/> 
     <Label text="Actual" textAlign="Center" width="100%"/> 
    </table:multiLabels> 
    <table:template> 
     <Label text="{Actual}"/>  
    </table:template> 
    </table:Column> 
</table:Table>