JSFiddle - React, Tailwind, and code Playground

by Oleg Kiriljuk

HTML

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/redmond/jquery-ui.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/free-jqgrid/4.8.0/css/ui.jqgrid.css">
<script src="//cdn.jsdelivr.net/free-jqgrid/4.8.0/js/jquery.jqgrid.src.js"></script>
<table id="jqGrid"></table>
<div id="jqGridPager"></div>

JavaScript

var serverResponse = {
	"userdata": {
        "ALFKI": 12.34,
        "ANATR": 23.45,
        "AROUT": 34.56,
        "BERGS": 45.67,
        "BLAUS": 56.78
    },
	"rows":[
		{"OrderID":"10835","OrderDate":"1998-01-15 00:00:00","CustomerID":"ALFKI","EmployeeID":"1","Freight":"69.5300","ShipName":"Alfreds Futterkiste"},
		{"OrderID":"10952","OrderDate":"1998-03-16 00:00:00","CustomerID":"ALFKI","EmployeeID":"1","Freight":"40.4200","ShipName":"Alfreds Futterkiste"},
		{"OrderID":"11011","OrderDate":"1998-04-09 00:00:00","CustomerID":"ALFKI","EmployeeID":"3","Freight":"1.2100","ShipName":"Alfreds Futterkiste"},
		{"OrderID":"10692","OrderDate":"1997-10-03 00:00:00","CustomerID":"ALFKI","EmployeeID":"4","Freight":"61.0200","ShipName":"Alfreds Futterkiste"},
		{"OrderID":"10702","OrderDate":"1997-10-13 00:00:00","CustomerID":"ALFKI","EmployeeID":"4","Freight":"23.9400","ShipName":"Alfreds Futterkiste"},
		{"OrderID":"10643","OrderDate":"1997-08-25 00:00:00","CustomerID":"ALFKI","EmployeeID":"6","Freight":"29.4600","ShipName":"Alfreds Futterkiste"},
		{"OrderID":"10625","OrderDate":"1997-08-08 00:00:00","CustomerID":"ANATR","EmployeeID":"3","Freight":"43.9000","ShipName":"Ana Trujillo Emparedados y helados"},
		{"OrderID":"10759","OrderDate":"1997-11-28 00:00:00","CustomerID":"ANATR","EmployeeID":"3","Freight":"11.9900","ShipName":"Ana Trujillo Emparedados y helados"},
		{"OrderID":"10926","OrderDate":"1998-03-04 00:00:00","CustomerID":"ANATR","EmployeeID":"4","Freight":"39.9200","ShipName":"Ana Trujillo Emparedados y helados"},
		{"OrderID":"10308","OrderDate":"1996-09-18 00:00:00","CustomerID":"ANATR","EmployeeID":"7","Freight":"1.6100","ShipName":"Ana Trujillo Emparedados y helados"},
		{"OrderID":"10677","OrderDate":"1997-09-22 00:00:00","CustomerID":"ANTON","EmployeeID":"1","Freight":"4.0300","ShipName":"Antonio Moreno Taquer\u00eda"},
		{"OrderID":"10365","OrderDate":"1996-11-27...