Hi,
Here is the code:
<!DOCTYPE HTML> <html> <head> <title>Selected Row of Table Editable Demo </title> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv='Content-Type' content='text/html;charset=UTF-8' /> <script src="https://sapui5.hana.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_bluecrystal"> </script> <!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required --> <script> // Model Data (local) var aData = [{ID: "1", lname: "Kiran", fname: "Valluru"}, {ID: "2", lname: "Kishore", fname: "Valluru"}]; // Define a table var oTable = new sap.ui.table.Table({ title: "Line Items", visibleRowCount: 7, firstVisibleRow: 3, selectionMode: sap.ui.table.SelectionMode.Single, toolbar: new sap.ui.commons.Toolbar({items: [ new sap.ui.commons.Button({ text: "Addnew", style: sap.ui.commons.ButtonStyle.Accept, press: function() { var modelData = oModel.getData(); var rowCount = modelData.modelData.length; rowCount = rowCount + 1; aData.push({ID: rowCount, lname: " "}); // Push data to Model oModel.setData({modelData: aData}); // Set Model }}) ]}), }); oTable.addColumn(new sap.ui.table.Column({ label: new sap.ui.commons.Label({ text: "ID" }), template: new sap.ui.commons.TextField({ value: '{ID}', }), sortProperty: "ID", filterProperty: "ID", width: "125px" })); oTable.addColumn(new sap.ui.table.Column({ label: new sap.ui.commons.Label({ text: "Last Name" }), template: new sap.ui.commons.TextField({ value: '{lname}', }), sortProperty: "lname", filterProperty: "lname", width: "125px" })); oTable.addColumn(new sap.ui.table.Column({ label: new sap.ui.commons.Label({ text: "First Name" }), template: new sap.ui.commons.TextField({ value: '{fname}', }), sortProperty: "fname", filterProperty: "fname", width: "125px" })); //Create a model and bind the table rows to this model var oModel = new sap.ui.model.json.JSONModel(); // created a JSON model oModel.setData({ // Set the data to the model using the JSON object defined already modelData: aData }); oTable.setModel(oModel); oTable.bindRows("/modelData"); // binding all the rows into the model //Place the Table on the UI oTable.placeAt("MemTable"); </script> </head> <body class="sapUiBody"> <div id="MemTable"></div> </body> </html>
hope this helps u,
Regards,
Kiran