JSFiddle - React, Tailwind, and code Playground
by indrajith patel
HTML
<!DOCTYPE HTML>
<script src="https://sapui5.netweaver.ondemand.com/resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.ui.commons,sap.ui.table"
data-sap-ui-theme="sap_goldreflection">
</script>
<!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required -->
<script>
sap.ui.localResources("clickcell");
var view = sap.ui.view({id:"idcell1", viewName:"clickcell.cell", type:sap.ui.core.mvc.ViewType.JS});
view.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
JavaScript
var adata = [{name : "SAP" , lvalue : "10"},
{name : "indrajith" , lvalue : "20"},
{name : "SAP" ,lvalue : "30"},
{name : "SCN" , lvalue : "440"},
{name : "JQUERY" , lvalue : "1054"},
{name : "SAP1" , lvalue : "104"},
{name : "SAP2" , lvalue : "1045"},
{name : "SAP3" , lvalue : "140"},
{name : "SAP4" , lvalue : "1560"},
{name : "SAP5" , lvalue : "150"},
];
var oModel = sap.ui.model.json.JSONModel();
oModel.setData(adata);
var oTable = new sap.ui.table.Table("tableid",{
selectionMode : sap.ui.table.SelectionMode.Single,
selectionBehavior: sap.ui.table.SelectionBehavior.Row,
visibleRowCount : 6,
rowSelectionChange: function(oEvent) {
//var oRow = oEvent.oSource.getParent();
//aCells = oRow.getCells();
}
});
oTable.addColumn(new sap.ui.table.Column({
label : new sap.ui.commons.Label({text : "Name"}),
template :(new sap.ui.commons.TextField({value : "{name}"}).attachBrowserEvent("click",function(e){
var pid = e.target.id
alert(sap.ui.getCore().byId(pid).getValue())
}))
}));
oTable.addColumn(new sap.ui.table.Column({
label : new sap.ui.commons.Label({text : "valuess"}),
template : (new sap.ui.commons.TextField({value : "{lvalue}"}).attachBrowserEvent("click",function(e){
var pid = e.target.id
alert(sap.ui.getCore().byId(pid).getValue())
}))
}));
oTable.setModel(oModel);
oTable.bindRows("/");
oTable.placeAt("content");