JSFiddle - React, Tailwind, and code Playground
by redoak2000
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/redmond/jquery-ui.css">
<link rel="stylesheet" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.6.0/css/ui.jqgrid.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>
<script src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.6.0/js/i18n/grid.locale-en.js"></script>
<script src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.6.0/js/jquery.jqGrid.src.js"></script>
<table id="list">
<tr>
<td></td>
</tr>
</table>
<div id="pager"></div>
CSS
.ui-widget-content .rowClass2 {
color: blue;
background-color: red !important;
background-image: none;
}
.ui-widget-content .rowClass {
color:red;
background-color: lightyellow !important;
background-image:none;
}
JavaScript
$(document).ready(function () {
"use strict";
var mydata = [{
id: "10",
invdate: "2007-10-01",
name: "test1",
note: "note1",
amount: "200.123",
tax: "10.00",
closed: true,
ship_via: "TN",
total: "210.00"
}, {
id: "20",
invdate: "2007-10-02",
name: "test1",
note: "note2",
amount: "300.456",
tax: "20.00",
closed: false,
ship_via: "FE",
total: "320.00"
}, {
id: "30",
invdate: "2007-09-01",
name: "test3",
note: "note3",
amount: "400.789",
tax: "30.00",
closed: false,
ship_via: "FE",
total: "430.00"
}, {
id: "40",
invdate: "2007-10-04",
name: "test2",
note: "note4",
amount: "200.012",
tax: "10.00",
closed: true,
ship_via: "TN",
total: "210.00"
}, {
id: "50",
invdate: "2007-10-31",
name: "test2",
note: "note5",
amount: "300.345",
tax: "20.00",
closed: false,
ship_via: "FE",
total: "320.00"
}, {
id: "60",
invdate: "2007-09-06",
name: "test3",
note: "note6",
amount: "400.678",
tax: "30.00",
closed: false,
ship_via: "FE",
total: "430.00"
}, {
id: "70",
invdate: "2007-10-04",
name: "test3",
note: "note7",
amount:...