Tuesday, 25 December 2018

m.table js

table.view.js:
sap.ui.jsview("m.table.table", {
getControllerName : function() {
return "m.table.table";
},
createContent : function(oController) {
var oModel = new sap.ui.model.json.JSONModel([
                                               { value: 50, name: "ramu" },
                                               { value: 60, name: "ravi" },
                                               { value: 70, name: "raju" },
                                               { value: 80, name: "rao" }
                                             ]);

                                             var oTable = new sap.m.Table({
                                            id:"otable",
                                               columns: [
                                                 new sap.m.Column({ header: new sap.m.Label({text: "Name"})}),
                                                 new sap.m.Column({ header: new sap.m.Label({text: "Value"})})
                                               ],
                                               items: {
                                                 path: "/",
                                                 template: new sap.m.ColumnListItem({
                                                   cells: [
                                                     new sap.m.Text({ text: "{name}" }),
                                                     new sap.m.Text({ text: "{value}" })
                                                   
                                                   ]
                                                 })
                                               },
                                             });
                                           
                                             oTable.setModel(oModel);
                                             var btn1 =new sap.m.Button({
                                            id:"bt",
                              text:"button2",
                              press:function(){
                              oTable.removeColumn("value");
                              }
                             
                              }).addStyleClass("123");

return new sap.m.Page({
title: "Title",
showHeader:false ,
content: [
              oTable,btn1
]
});
}

});
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.m"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->

<script>
sap.ui.localResources("m.table");
var app = new sap.m.App({initialPage:"idtable1"});
var page = sap.ui.view({id:"idtable1", viewName:"m.table.table", type:sap.ui.core.mvc.ViewType.JS});
app.addPage(page);
app.placeAt("content");
</script>
<style>
#otable{
background-color: yellow;
 
}
.123{
background-color: dodgerblue;
justify-content:flex-end;
}
</style>

</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
output:

No comments:

Post a Comment

test ganaral binding(testing )

  /home/user/projects/project1/webapp/model/record.json: {     "text" : "outer text" ,     "myrecorsd" : [    ...