@{
    Layout = "~/Views/Shared/_InfoLayout.cshtml";
}

<div class="yc-panel">
    <h3>Jqgrid控件</h3>
    <hr />
    <table id='listGrid' class='scroll' cellpadding='0' cellspacing='0'></table><div id='pagerGrid'></div>
</div>

@section JS{
    <script>
        var colModelGrid = [{
            name: 'VarietyCode', label: '品种代码', index: 'VarietyCode', width: 70
        }, {
            name: 'VarietyName', label: '品种名称', index: 'VarietyName', width: 120
        }, {
            name: 'Commission', label: '手续费', index: 'Commission', width: 70,
            formatter: function (cellValue, options, rowObject) {
                return rowObject.CommissionForTenThousandth;
            }
        }];

        function __initJqgrid() {
            var grid = jQuery('#listGrid').jqGrid({
                url: '/demo/AjaxJqgridError',
                datatype: 'json',
                height: 'auto',
                width: '90%',
                autowidth: false,
                shrinkToFit: false,
                viewrecords: true,
                jsonReader: { repeatitems: false },
                cmTemplate: { align: 'center', width: 120 },
                mtype: 'POST',
                colModel: colModelGrid,
                pager: jQuery('#pagerGrid'),
                pagerpos: 'left',
                rowNum: 20,
                rowList: [20, 30, 50, 200, 10000],
                loadComplete() {
                    $('.ui-jqgrid-bdiv', '#gbox_listGrid').floatingScroll();
                },
                footerrow: false
            });
        }

        $(function () {

            __initJqgrid();
        });
    </script>
}