Hi,
I am trying the source codes from "SAPUI5 SDK - Demo Kit" tutorial..But these are not in MVC style.Only View is given.
Can you please tell me the detailed coding of Accordian including index.html and view.js and controller.js? so that the by referring one I will try the remaining modules like Application Header,Business card etc.
I will paste the code of Accordian which I tried in MVC style for which I am not getting output.Please tell me what mistake i am doing
index.html
<!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 src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.ui.commons"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required -->
<script>
sap.ui.localResources("accordion");
var view = sap.ui.view({id:"idmyView1", viewName:"accordion.myView", type:sap.ui.core.mvc.ViewType.JS});
view.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
view.js
sap.ui.jsview("accordion.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 accordion.myView
*/
getControllerName : function() {
return "accordion.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 accordion.myView
*/
createContent : function(oController) {
//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");
}
});
controller.js
sap.ui.controller("accordion.myView", {
});