JSFiddle - React, Tailwind, and code Playground

by jahrichie

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.1.2/handlebars.min.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/foundation/5.0.2/css/foundation.css">
<script id="all-closing-today" type="text/x-handlebars-template">
  <table style="width:100%">
    <thead>
      <th>active</th>
      <th>area_id </th>
      <th>bid_count</th>
      <th>metat tags</th>
    </thead>
    <tbody>
      {{#catalog_items}}
        <tr data-close-date="{{close_date}}">
          <td>{{active}}</td>
          <td>{{catalog_item_id}}</td>
          <td>{{bid_count}}</td>
          <td>{{metatags}}</td>
        </tr>
      {{/catalog_items}}
    </tbody>
  </table>
</script>
    
<div id="content-placeholder">&nbsp;</div>

JavaScript

var apiResponse = {};
$.getJSON( "http://sd.dev:3005/deploy_gaps", function( data ) {
    apiResponse = data;
    alert("api:", apiResponse)
});


var source     = $("#all-closing-today").html(),
    template   = Handlebars.compile(source);



var sampleData = {
                    "catalog_items": [
                    {
                    "active": false,
                    "anonymize_screen_names": false,
                    "area_id": 4532,
                    "auction_specialist_id": 14,
                    "bid_count": 2,
                    "catalog_item_id": 453200,
                    "close_date": "2013-12-13T09:24:00-05:00",
                    "closing_price_before_adjustments": null,
                    "collection_id": null,
                    "current_price": "35000.0",
                    "date_modified": "2013-12-13T09:44:17-05:00",
                    "delta": false,
                    "donation_information": null,
                    "donor_item_id": "",
                    "dream_big": false,
                    "experience": false,
                    "featured_keywords": {
                    "keywords": []
                    },
                    "highlight": false,
                    "item_id": 453200,
                    "live_bid": 0,
                    "metatags": "russell simmons, Rush Dream Big Dec 2013, Rush Philanthropic Arts Foundation, Rush Philanthropic Arts Foundation",
                    "minimum_bid": "37500.0",
                    "open_date": "2013-12-13T09:24:00-05:00",
                    "org_id": null,
                    "popcorn_started_at": null,
                    "position": 47784,
                    "pre_auth_bids": false,
                    "private_section_id": null,
                    "private_until": null,
                    "sale_type_id": 1,
                    "use_partner": null,
                    "user_modified": "[email protected]",
                    "winner_notified": false
       ...