使用json为jqgrid加载数据不起作用

时间:2015-09-05 20:05:55

标签: jquery json jqgrid asp.net-core-mvc

我疯了,你能帮我吗? 网格行没有出现,我不知道为什么它真的令人不安我花了3天以上的时间尝试,我真的需要帮助!!!!

我的行动方法:

  [HttpGet]
        [Produces("application/json")]
        public JsonResult GetSearches(string sidx, string sord, int page, int rows,string name)
        {
            var ls = db.Candidates.Select(

                z => new
                {
                    z.ID,
                    z.Name,
                    z.Email
                }
                );             
            int pageIndex = Convert.ToInt32(page) - 1;
            int pageSize = rows;

            int totalRecords = ls.Count();
            int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);
            if(!string.IsNullOrEmpty(name))
            {
                ls = ls.Where(x => x.Name.Contains(name));

            }
            if(sord.ToUpper()=="DESC")
            {

                ls = ls.OrderByDescending(x => x.Name);
                ls = ls.Skip(pageIndex * pageSize).Take(pageSize);
            }
            else
            {
                ls = ls.OrderBy(x => x.Name);
                ls = ls.Skip(pageIndex * pageSize).Take(pageSize);

            }
            var jsonData = new
            {

                total = totalPages,
                page,
                records = totalRecords,
                rows = ls

            };
            return Json(jsonData);
        }

我的观点:

@using MGroup.Data.Models
@model Candidate

@{
    Layout = "~/views/shared/_layouttestgrid.cshtml";

}
<fieldset>
    <div id="parent">

        <div style="float:left;width:35%;">
            <div>
                @Html.LabelFor(model => model.Name)
            </div>
            <div>
                @Html.TextBoxFor(model => model.Name, new { @class = "filterItem" })
            </div>
        </div>

        <div>
            <input type="button" id="filterButton" name="search" value="filter" />
        </div>
    </div>
</fieldset>
<br />
<div>
    <table id="grid"></table>
    <div id="pager">

    </div>
</div>

<link href="~/JqGrid/themes/base/jquery-ui.css" rel="stylesheet" />
<link href="~/JqGrid/jquery.jqGrid/ui.jqgrid.css" rel="stylesheet" />
<script src="~/JqGrid/scripts/jquery-1.9.1.min.js"></script>
<script src="~/JqGrid/scripts/i18n/grid.locale-en.js"></script>
<script src="~/JqGrid/scripts/jquery-ui-1.10.4.min.js"></script>
<script src="~/JqGrid/scripts/jquery.jqgrid.min.js"></script>
<script src="~/JqGrid/Scripts/MyList.js"></script>

我的JavaScript文件:

$(function () {
    $("#grid").jqGrid({
        url: '/Candidate/GetSearches',
        dataType: 'json',
        mtype: 'Get',

        colNames: ['ID', 'Name', 'Email'],
        colModel: [
            { key: true, hidden: true, name: 'ID', index: 'ID' },
            { key: false, name: 'Name', index: 'Name' },
            { key: false, name: 'Email', index: 'Email' }
        ],
        pager: jQuery('#pager'),
        rowNum: 10,
        rowList: [10, 20, 30, 40],
        height: '100%',
        viewrecords: true,
        loadone: false,
        caption: 'Searches',
        emptyrecords: 'No records to display',

        jsonReader: {
            root: "rows",
            page: "page",
            total: "total",
            records:"records",
            repeatitems: false,
            Id: "0"
        },
        autowidth: true,
        multiselect: false
    })
     .navGrid('#pager', { edit: false, add: false, del: false, search: false, refresh: true });

    $('#filterButton').click(function (event) {
        event.preventDefault();
        filterGrid();
    });
});

function filterGrid() {

    var postDataValues = $("#grid").jqGrid('getGridParam', 'postData');

    $('.filterItem').each(function (index, item) {

        postDataValues[$(item).attr('id')] = $(item).val();
    });
    $('#grid').jqGrid().setGridParam({ postData: postDataValues, page: 1 }).trigger('reloadGrid');

}

0 个答案:

没有答案