JSFiddle - React, Tailwind, and code Playground

by JayData

HTML

<script src="http://include.jaydata.org/jaydata.js"></script>

JavaScript

$data.Entity.extend('FTALocalData.TaxWageDetail', {
        'LocalId': { 'key': true, 'type': 'Edm.Int32', 'computed': true },
        'ActivityDt': { 'type': 'Edm.DateTime' },
        'AddChgDt': { 'type': 'Edm.DateTime', 'nullable': false, 'required': true },
        'ConfirmationId': { 'type': 'Edm.Int64' },
        'CreateDt': { 'type': 'Edm.DateTime' },
        'DownloadDt': { 'type': 'Edm.DateTime' },
        'Ebp1ActivityDt': { 'type': 'Edm.DateTime' },
        'Ebp1StateLu': { 'type': 'Edm.String' },
        'Ebp2ActivityDt': { 'type': 'Edm.DateTime' },
        'Ebp2StateLu': { 'type': 'Edm.String' },
        'EmplrId': { 'type': 'Edm.Int64', 'nullable': false, 'required': true },
        'FirstName': { 'type': 'Edm.String' },
        'Id': { 'type': 'Edm.Int64', 'nullable': true, 'required': false },
        'LastName': { 'type': 'Edm.String' },
        'MiddleName': { 'type': 'Edm.String' },
        'NameSegment': { 'type': 'Edm.String' },
        'Qtr': { 'type': 'Edm.Int16', 'nullable': false, 'required': true },
        'QtrEarnings': { 'type': 'Edm.Decimal', 'nullable': false, 'required': true },
        'Ssn': { 'type': 'Edm.String' },
        'UpdateDt': { 'type': 'Edm.DateTime' },
        'UpdateUser': { 'type': 'Edm.String' },
        'UsedStateLu': { 'type': 'Edm.String' },
        'Year': { 'type': 'Edm.Int16', 'nullable': false, 'required': true },
        //'Taxemplr': { 'type': 'FTALocalData.TaxEmplr', 'inverseProperty': 'TaxWageDetails' }
});

$data.EntityContext.extend('MyContextType', {
    Details: { type: $data.EntitySet, elementType: FTALocalData.TaxWageDetail }
});

context = new MyContextType({ name: 'webSql' });

context.onReady()
.then(function() {
    context.Details.addMany([
        { AddChgDt: new Date(), EmplrId: '123', Id: '123', Qtr: 1, QtrEarnings: '123', Year: 1 },
        { AddChgDt: new Date(), EmplrId: '124', Id: '124', Qtr: 2, QtrEarnings: '124', Year: 2 },
        { AddChgDt: new Date(), EmplrId: '125', Id: '125',...