JSFiddle - React, Tailwind, and code Playground
HTML
<div class="tab-pane" id="offer_pending">
<div class="promotions-list">
<div class="col-xs-12 col-md-8 col-md-offset-2 text-center noPad mT20">
<div class="col-xs-9 col-md-9 noPad">
<input type="text" class="form-control" placeholder="Search for a pending coupon"/>
</div>
<div class="col-xs-3 col-md-3 noPad">
<button type="button" class="btn btn-success pull-left mL30">Search</button>
</div>
</div>
<div class="col-xs-12 col-md-12 mT20 mB20 noPad">
<h5>You can view pending coupons that can be pushed to a groups of consumers or to a specific consumer</h5>
</div>
<table class="table table-striped pull-left offer-active-table">
<thead>
<tr>
<!--<th></th>-->
<th>Coupon Code</th>
<th>Coupon Title</th>
<th>Coupon Type</th>
<th>Creation Date</th>
</tr>
</thead>
<tbody id="tblpendingofferlist"></tbody>
</table>
</div>
</div>
JavaScript
var myCellId="store";
function populateActiveCoupons() {
var serviceUrl = "http://192.168.2.87:8081/store/web/webStoreService/getActiveOffers";
var url = getServiceUrl(myCellId, serviceUrl);
var callbackFnParam = {};
var param = {};
serviceLookUp(url, 'GET', false, param, callbackFn_populateActiveCoupons, callbackFnParam);
}
$('#tblactiveofferlist').empty();
alert(data.offers);
$.tmpl(couponlist, data.offers).appendTo("#tblactiveofferlist").click(function () {
var item = $.tmplItem(this);
var couponview = JSON.parse(JSON.stringify(item.data));
var PromotionId = couponview.promotionId;
var BusinessId = couponview.businessId;
//alert(BusinessId);
$('#offerId').val(PromotionId);
$('#storeId').val(BusinessId);
getBusinessLogoandOfferDetails(callbackFn_getOfferwithBusinessLogoDetails);
//coupondetailview(couponview, "A");
});