<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script
id="sap-ui-bootstrap"
src='https://sapui5.hana.ondemand.com/resources/sap-ui-core.js'
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-libs="sap.m,sap.ui.commons,sap.ui.layout,sap.suite.ui.commons"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-resourceroots='{
"sap.ui.demo.wt": "./"
}'>
</script>
<!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required -->
<script>
var view = sap.ui.view({id:"idmyView1", viewName:"sap.ui.demo.wt.myView", type:sap.ui.core.mvc.ViewType.JS});
view.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
// Code goes here
/* Styles go here */
sap.ui.jsview("sap.ui.demo.wt.myView", {
/** Specifies the Controller belonging to this View.
* In the case that it is not implemented, or that "null" is returned, this View does not have a Controller.
* @memberOf routingdemo.App
*/
getControllerName : function() {
return "sap.ui.demo.wt.myView";
},
/** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed.
* Since the Controller is given to this method, its event handlers can be attached right away.
* @memberOf routingdemo.App
*/
createContent : function(oController) {
this.setDisplayBlock(true);
var oVCard = new sap.suite.ui.commons.BusinessCard({
firstTitle: new sap.ui.commons.Label({id:"vcard1-name-label",text:"White, Helen",tooltip:"White, Helen"}),
iconPath: "sap-icon://employee",
secondTitle: "Sales Contact at Customer Side",
imageTooltip:"White, Helen",
width: "424px"
});
var oContentCard = new sap.ui.commons.layout.MatrixLayout({widths:["20px", "100px"]});
var oCell = new sap.ui.commons.layout.MatrixLayoutCell({hAlign:sap.ui.commons.layout.HAlign.Center});
oCell.addContent(new sap.ui.commons.TextView({text:"Phone:"}));
oContentCard.createRow(oCell, new sap.ui.commons.TextView({text:"+41 (635) 457-2875"}));
oCell = new sap.ui.commons.layout.MatrixLayoutCell({hAlign:sap.ui.commons.layout.HAlign.Center});
oCell.addContent(new sap.ui.commons.TextView({text:"E-Mail:"}));
oContentCard.createRow(oCell, new sap.ui.commons.TextView({text:"helen.white@company.com"}));
oContentCard.createRow(new sap.ui.commons.TextView({text:"Address:"}), new sap.ui.commons.TextView({text:"Diermar-Hopp Allee 16"}));
oVCard.setContent(oContentCard);
//create the ApplicationHeader control
var oAppHeader = new sap.ui.commons.ApplicationHeader("appHeader");
//configure the branding area
oAppHeader.setLogoSrc("http://www.sap.com/global/images/SAPLogo.gif");
oAppHeader.setLogoText("SAP Accordion Sample");
//configure the welcome area
oAppHeader.setDisplayWelcome(true);
oAppHeader.setUserName("Sindhuja");
//configure the log off area
oAppHeader.setDisplayLogoff(true);
//Create the Accordion control
var oAccordion = new sap.ui.commons.Accordion("accordionA");
//Building Section 1
var oSection1 = new sap.ui.commons.AccordionSection( "section1" );
oSection1.setTitle("Section 1");
oSection1.setTooltip("Section 1");
oSection1.setMaxHeight("100px");
for (var i=0 ; i < 5 ; i++){
var oCheckBox1 = new sap.ui.commons.CheckBox( "CheckBox1"+i );
oCheckBox1.setText("CheckBox1 "+i);
oSection1.addContent( oCheckBox1);
var oLabel1 = new sap.ui.commons.Label( "Label1"+i );
oLabel1.setText("Label 1 "+i);
oSection1.addContent( oLabel1);
}
oAccordion.addSection( oSection1 );
//Building Section 2
var oSection2 = new sap.ui.commons.AccordionSection( "section2");
oSection2.setTitle("Section 2");
for (var i=0 ; i < 5 ; i++){
var oCheckBox2 = new sap.ui.commons.CheckBox( "CheckBox2"+i );
oCheckBox2.setText("CheckBox2 "+i);
oSection2.addContent( oCheckBox2);
}
oAccordion.addSection( oSection2 );
//Building Section 3
var oSection3 = new sap.ui.commons.AccordionSection( "section3");
oSection3.setTitle("Section 3");
oSection3.setEnabled(false);
var oCheckBox3 = new sap.ui.commons.CheckBox( "CheckBox3" );
oSection3.addContent( oCheckBox3);
oAccordion.addSection( oSection3 );
//Building Section 4
var oSection4 = new sap.ui.commons.AccordionSection( "section4");
oSection4.setTitle("Section 4");
var oCheckBox4 = new sap.ui.commons.CheckBox( "CheckBox4" );
oSection4.addContent( oCheckBox4);
//Accordion properties settings
oAccordion.addSection( oSection4 );
oAccordion.setWidth("200px");
var oLayout = new sap.ui.layout.VerticalLayout({width:"100%",content:[oAppHeader,oVCard,oAccordion]});
return oLayout;
}
});
sap.ui.controller("sap.ui.demo.wt.myView", {
/**
* Called when a controller is instantiated and its View controls (if available) are already created.
* Can be used to modify the View before it is displayed, to bind event handlers and do other one-time initialization.
* @memberOf table_v01.Main
*/
onInit: function() {
}
});