JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//trirand.com/blog/jqgrid/js/jquery.jqGrid.src.js"></script>
<script src="//trirand.com/blog/jqgrid/js/i18n/grid.locale-en.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/base/jquery-ui.css">
<link rel="stylesheet" href="//trirand.com/blog/jqgrid/themes/ui.jqgrid.css">
<table id="grid"></table>
<div id="pager"></div>
<ul>
    <li>Increment One Page</li>
    <li>Buttons for one-page increment/decrement and return to beginning no longer work</li>
</ul>
<p>
    This only occurs when the sortGrid method is called within the loadComplete event handler</p>

JavaScript

$(document).ready(function(){            
    var data = {            
        page: 1,            
        records: 16,            
        rows: [            
            {"column1":"R01C1","column2":"R01C2","column3":"R01C3"},            
            {"column1":"R02C1","column2":"R02C2","column3":"R02C3"},            
            {"column1":"R03C1","column2":"R03C2","column3":"R03C3"},            
            {"column1":"R04C1","column2":"R04C2","column3":"R04C3"},            
            {"column1":"R05C1","column2":"R05C2","column3":"R05C3"},            
            {"column1":"R06C1","column2":"R06C2","column3":"R06C3"},            
            {"column1":"R07C1","column2":"R07C2","column3":"R07C3"},            
            {"column1":"R08C1","column2":"R08C2","column3":"R08C3"},            
            {"column1":"R09C1","column2":"R09C2","column3":"R09C3"},            
            {"column1":"R10C1","column2":"R10C2","column3":"R10C3"},            
            {"column1":"R11C1","column2":"R11C2","column3":"R11C3"},            
            {"column1":"R12C1","column2":"R12C2","column3":"R12C3"},            
            {"column1":"R13C1","column2":"R13C2","column3":"R13C3"},            
            {"column1":"R14C1","column2":"R14C2","column3":"R14C3"},            
            {"column1":"R15C1","column2":"R15C2","column3":"R15C3"},            
            {"column1":"R16C1","column2":"R16C2","column3":"R16C3"}            
        ]
    };            
    $('#grid').jqGrid({            
        datatype: 'jsonstring',            
        datastr: data,            
        colNames:['COLUMN1','COLUMN2','COLUMN3'],            
        width: 600,            
        height: 'auto',            
        colModel:[            
            {name:'column1',index:'column1'},            
            {name:'column2',index:'column2'},            
            {name:'column3',index:'column3'}            
        ],            
        jsonReader: { repeatitems: false...