Skip to content

Instantly share code, notes, and snippets.

@dennisseah
Last active August 29, 2015 14:05
Show Gist options
  • Save dennisseah/c945e92acf379b053b3f to your computer and use it in GitHub Desktop.
Save dennisseah/c945e92acf379b053b3f to your computer and use it in GitHub Desktop.
SAPUI5: Cell dependency in sap.ui.table.Table
<!DOCTYPE HTML>
<html>
<head>
<!-- Column2 is editable only if Column 1 is an integer
-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<script id="sap-ui-bootstrap"
type="text/javascript"
data-sap-ui-libs="sap.ui.table,sap.ui.commons"
data-sap-ui-theme="sap_bluecrystal"
src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js">
</script>
<script>
jQuery(function() {
var oTable = new sap.ui.table.Table({
width: '300px',
selectionMode: sap.ui.table.SelectionMode.None
});
oTable.addColumn(new sap.ui.table.Column({
label: 'Column1',
template: new sap.ui.commons.TextField({
value: '{col1}',
change: function(e) {
var cxt = e.getSource().getBindingContext();
var path = cxt.getPath();
var idx = parseInt(path.substring(1), 10);
var m = oTable.getModel();
var d = m.getData();
var v = d[idx];
v.valid = (isNaN(v.col1) === false);
m.setData(d);
}
})
}));
oTable.addColumn(new sap.ui.table.Column({
label: 'Column2',
template: new sap.ui.commons.TextField({
value: '{col2}',
enabled: {
path: 'valid',
formatter: function(v) {
return (v !== false);
}
}
})
}));
oTable.bindRows('/')
var model = new sap.ui.model.json.JSONModel();
model.setData([
{col1: 1, col2: 'Ann'},
{col1: 2, col2: 'John'},
{col1: 3, col2: 'Mary'}
]);
oTable.setModel(model);
oTable.placeAt('content');
});
</script>
</head>
<body class="sapUiBody">
<div id="content"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment