Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
  <head>
<meta name="description" content="SAPUI5 App with tree table data format">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta charset="utf-8">
    
    <title>MVC with XmlView</title>
    
    <script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m"></script>
    
    <script id="view1" type="sapui5/xmlview">
      <mvc:View
        controllerName="local.controller"
        xmlns:html="http://www.w3.org/1999/xhtml"
        xmlns:mvc="sap.ui.core.mvc" xmlns:t="sap.ui.table"
        xmlns:tnt="sap.tnt"
        xmlns="sap.m">
         <html:style>
​
                 .myText {
                 font-size:large;
    
                  background-color:red;
​
                  color:white;
​
                  padding:4px
​
                                 }
​
          </html:style>
      <tnt:InfoLabel id="il7" text="category limited notice" 
        colorScheme="2"  displayOnly= "false"  width="60rem"/>
      <Link text="Help" emphasized="true" class="sapUiSmallMarginBegin myText"/>
          
            
         <IconTabBar id="mainTab">
         
         <items>
           <IconTabFilter icon="sap-icon://account" text="table">
        
        
         <!-- <List
            id="people"
            items="{/roles}">
            <DisplayListItem
              label="{role}"
              value="{properties}" />
          </List>-->
          <t:TreeTable
                    id="TreeTableBasic"
                    rows="{/roles}"
                    selectionMode="Single"
                    enableSelectAll="false"
                    ariaLabelledBy="title">
              
                <t:columns>
                    <t:Column width="13rem">
                        <Label text="Role"/>
                        <t:template>
                            <Text text="{rolename}" wrapping="false" />
                        </t:template>
                    </t:Column>
                    <t:Column width="9rem">
                        <Label text="Desc"/>
                        <t:template>
                            <Text text="{desc}" wrapping="false" />
                        </t:template>
                    </t:Column>
                    <t:Column width="5rem">
                        <Label text="Query"/>
                        <t:template>
                           <Text text="{query}"/>
                        </t:template>
                    </t:Column>
                    <t:Column width="5rem">
                        <Label text="Dreary"/>
                        <t:template>
                           <Button icon="sap-icon://sys-minus" enabled="false" />
                        </t:template>
                    </t:Column>
                </t:columns>
            </t:TreeTable>
            <Button class="sapUiLargeMarginLeft"
            text="Demo Fiori Application"
            press="doSomething" />
            
            </IconTabFilter>
            <IconTabSeparator icon="sap-icon://open-command-field"/>
            <IconTabFilter icon="sap-icon://alert" text="charts">
            </IconTabFilter>
           </items>
           </IconTabBar>
      </mvc:View> 
    </script>
  </head>
  <body class='sapUiBody'>
    <div id='content'></div>
  </body>
</html>
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
dezm101pro
0viewers