Table-BeforePaddingRemove

<!DOCTYPE HTML>
<html>

<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta charset="UTF-8">
  <title>Table Model Update</title>
  <script id="sap-ui-bootstrap" type="text/javascript" src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m" data-sap-ui-xx-bindingSyntax="complex">
  </script>
  <!-- XML-based view definition -->
  <script id="chartView" type="sapui5/xmlview">
    <mvc:View controllerName="myTable.view" xmlns:l="sap.ui.layout" xmlns:core="sap.ui.core" xmlns:u="sap.ui.unified" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" class="viewPadding">
      <App>
        <pages>
          <Page title="Products Page" class="marginBoxContent">
            <content>
              <VBox id="oVBox">
                <Table id="idProductsTable" mode="SingleSelectMaster" selectionChange="rowSelect" items="{/modelData/productsData}"
				growing="true" growingThreshold="4">
                  <columns>
                    <Column>
                      <Label text="Product" />
                    </Column>
                    <Column>
                      <Label text="Weight" />
                    </Column>
                    <Column>
                      <Label text="Product Input" />
                    </Column>
                    <Column>
                      <Label text="Product Select" />
                    </Column>
                  </columns>
                  <items>
                    <ColumnListItem>
                      <cells>
                        <Text text="{Product}" />
                        <Text text="{Weight}" />
                        <Input />
                        <Select items="{
            path: '/modelData/selectData'
          }">
                          <core:Item key="{Key}" text="{Text}" />
                        </Select>
                      </cells>
                    </ColumnListItem>
                  </items>
                </Table>
              </VBox>
            </content>
          </Page>
        </pages>
      </App>
    </mvc:View>
  </script>
  <script>
      // Controller definition
    sap.ui.controller("myTable.view", {
      onInit: function() {
        var dataObject = [{
          Product: "Power Projector 4713",
          Weight: "1467"
        }, {
          Product: "Gladiator MX",
          Weight: "321"
        }, {
          Product: "Hurricane GX",
          Weight: "588"
        }, {
          Product: "Webcam",
          Weight: "700"
        }, {
          Product: "Monitor Locking Cable",
          Weight: "40"
        }, {
          Product: "Laptop Case",
          Weight: "1289"
        }, {
          Product: "USB Stick 16 GByte",
          Weight: "11"
        }, {
          Product: "Deskjet Super Highspeed",
          Weight: "100"
        }, {
          Product: "Laser Allround Pro",
          Weight: "2134"
        }];

        var oSelectValues = [{
          Text: "Enabled",
          Key: "Enabled"
        }, {
          Text: "Disabled",
          Key: "Disabled"
        }];
        var model = new sap.ui.model.json.JSONModel();
        model.setData({
          modelData: {
            productsData: []
          }
        });
        sap.ui.getCore().setModel(model);
        sap.ui.getCore().getModel().setProperty("/modelData/productsData", dataObject);
        sap.ui.getCore().getModel().setProperty("/modelData/selectData", oSelectValues);
        var oSelectModel = sap.ui.getCore().getModel().getProperty("/modelData/selectData");
      },
      rowSelect: function(oEvent) {
        var oSelectedItem = oEvent.getParameter("listItem");
      }
    });
    // Instantiate the View, assign a model
    // and display
    var oView = sap.ui.xmlview({
      viewContent: jQuery('#chartView').html()
    });

    oView.placeAt('content');
  </script>
  </head>

<body class="sapUiBody" role="application">
  <div id="content"></div>
</body>

</html>

// Code goes here

/* Styles go here */