JSFiddle - React, Tailwind, and code Playground

by Sanjay Aswani

HTML

<script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"></script>
<div id='content'></div>

JavaScript

var oTable = new sap.ui.table.Table({
			id: "oTable",
		    title: "",
		    showNoData : true,  
		    selectionMode: sap.ui.table.SelectionMode.None,
		    visibleRowCount: 12,
		    navigationMode: sap.ui.table.NavigationMode.Paginator
		});

    oTable.bindColumns("meta>/", function(sId, oContext) {
		    var sColumnId = oContext.getObject().ColLable;
		    var columnNo = oContext.getObject().ColPosition;
		    columnNo = parseInt(columnNo,10) + 1;
		    var string = "data>Col" + columnNo;
		    return new sap.ui.table.Column({
		        label: sColumnId, 
		        template: new sap.ui.commons.TextView().bindText(string)
		    });
		});
		
		oTable.bindRows("data>/");
	
		var xlBtn = new sap.m.Button({id:"xlBtn", text:"Export To Excel", width:"100%", press:oController.exportExcel, layoutData: new sap.ui.layout.GridData({span:"L2 M1 S1"})});
		var pdfBtn = new sap.m.Button({id:"pdfBtn", text:"Export To PDF", width:"100%", press:oController.exportPdf, layoutData: new sap.ui.layout.GridData({span:"L2 M1 S1"})});
		var printBtn = new sap.m.Button({id:"printBtn", text:"Print", width:"100%", press:oController.print, layoutData: new sap.ui.layout.GridData({span:"L2 M1 S1"})});
		
		var btnGrid = new sap.ui.layout.Grid({
			id: "btnGrid",
			visible : true, // boolean
			width : "100%", // sap.ui.core.CSSSize
			vSpacing : 1, // float
			hSpacing : 0.5, // float
			position : sap.ui.layout.GridPosition.Left, // sap.ui.layout.GridPosition
			defaultSpan : "L6 M6 S6", // sap.ui.layout.GridSpan
			content : [xlBtn, pdfBtn, printBtn]
		// sap.ui.core.Control
		});
		
		var bar = new sap.m.Bar({
			visible : true, // boolean
			contentLeft : [new sap.m.Label({id:"footerText", text:"Infosys \u00A9 2015"})] // sap.ui.core.Control
		// sap.ui.core.Control
		});
		
		var mainPage = new sap.m.Page({
			id : "mainPage",
			showNavButton : true,
			navButtonPress : oController.handleBack,
			visible : true, // boolean
			showHeader : true, // boolean
			enableScrolling : true,...