Asp.net mvc 具有动态colname的Jqgrid？

脚本：

$.ajax({
    url: '/Widget/GetTestData',
    type: 'POST',
    data: {},
    success: function (result) {
        var colModels = result.Json.colModels;
        var colNames = result.Json.colNames;
        var data = result.Json.data.options;
        $("#grid_table").jqGrid({
            datatype: 'jsonstring',
            datastr: data,
            colNames: colNames,
            colModel: colModels,
            jsonReader: {
                root: 'rows',
                repeatitems: false
            },
            gridview: true,
            pager: $('#gridpager'),
            height: 349,
            width:968,
            rowNum: 5,
            rowList: [5, 10, 20, 50],
            viewrecords: true
        }).navGrid('#gridpager'); //end jqgrid
    },
    error: function (result) {
        alert("Seçilen kritere uygun veri bulunamadı!");
    }
});    //end ajax

控制器

public ActionResult GetTestData()
{
    var result = new
        {
            Json = new
            {
                colNames = new[]
                {
                    "T1","T2"
                },
                colModels = new[]
                {
                   new {
                        index = "T1",
                        label = "T1",
                        name = "T1",
                        width = 100
                    },new {
                        index = "T2",
                        label = "T2",
                        name = "T2",
                        width = 100
                    }
                },
                data = new
                {
                    options = new
                    {
                        page = "1",
                        total = "1",
                        records = "1",
                        rows = new[] {
                            new{T1=123,T2=321},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934}
                        }
                    }
                }
            }
        };
}

public ActionResult GetGridData(string sidx, string sord, int page, int rows)
{
    IEnumerable<MeterReadingsForChart> meterReadings = MeterReadingManager.GetCustomerTotalMeterReadings(9, 1, /*DateTimeManager.GetStartDate(0)*/DateTime.Now.AddDays(-40), DateTime.Now, DateTimeManager.GetTimeIntervalTypeById(0));

    int pageIndex = Convert.ToInt32(page) - 1;
    int pageSize = rows;
    int totalRecords = meterReadings.Count();
    int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);

    var result = new
    {
        total = totalPages,
        page = page,
        records = totalRecords,
        rows = meterReadings.Skip((pageIndex) * pageSize).Select(x => new { T1 = x.Name, OkumaTarihi = x.ReadDate.ToString("dd.MM.yyyy - hh:mm:ss"), Value = x.Value }).ToArray()
    };

    return Json(result, JsonRequestBehavior.AllowGet);
}

这个代码有效。它从服务器获取所有数据。但我想从服务器获取部分数据，以每页为单位

当我写下面的内容时，我可以做我想做的，但我不能动态地得到名字

$("#grid_table").jqGrid({
    url: '/Widget/GetGridData',
    datatype: "json",
    mtype: 'POST',
    postData: { DateRangeType: date_range_id, MeterType: meter_type_id, StartDate: start_date, EndDate: end_date },
    colNames: ['Okuma Tarihi', 'T1', 'T2', 'T2', 'Toplam'],
    colModel: [
            { name: 'OkumaTarihi', index: 'OkumaTarihi', width: 150, sortable: true, editable: false },
            { name: 'T1', index: 'T1', sortable: true, editable: false },
            { name: 'T2', index: 'T2', sortable: true, editable: false },
            { name: 'T3', index: 'T3', sortable: true, editable: false },
            { name: 'Toplam', index: 'Toplam', sortable: true, editable: false }
       ],
    rowNum: 20,
    rowList: [20, 30],
    pager: $('#gridpager'),
    sortname: 'Name',
    viewrecords: true,
    sortorder: "asc",
    width: 968,
    height: 349,
    jsonReader: {
        root: "rows", //array containing actual data
        page: "page", //current page
        total: "total", //total pages for the query
        records: "records", //total number of records
        repeatitems: false,
        id: "id" //index of the column with the PK in it
    }
}).navGrid('#gridpager'); //end jqgrid

控制器

public ActionResult GetTestData()
{
    var result = new
        {
            Json = new
            {
                colNames = new[]
                {
                    "T1","T2"
                },
                colModels = new[]
                {
                   new {
                        index = "T1",
                        label = "T1",
                        name = "T1",
                        width = 100
                    },new {
                        index = "T2",
                        label = "T2",
                        name = "T2",
                        width = 100
                    }
                },
                data = new
                {
                    options = new
                    {
                        page = "1",
                        total = "1",
                        records = "1",
                        rows = new[] {
                            new{T1=123,T2=321},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934},
                            new{T1=4532,T2=934}
                        }
                    }
                }
            }
        };
}

public ActionResult GetGridData(string sidx, string sord, int page, int rows)
{
    IEnumerable<MeterReadingsForChart> meterReadings = MeterReadingManager.GetCustomerTotalMeterReadings(9, 1, /*DateTimeManager.GetStartDate(0)*/DateTime.Now.AddDays(-40), DateTime.Now, DateTimeManager.GetTimeIntervalTypeById(0));

    int pageIndex = Convert.ToInt32(page) - 1;
    int pageSize = rows;
    int totalRecords = meterReadings.Count();
    int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);

    var result = new
    {
        total = totalPages,
        page = page,
        records = totalRecords,
        rows = meterReadings.Skip((pageIndex) * pageSize).Select(x => new { T1 = x.Name, OkumaTarihi = x.ReadDate.ToString("dd.MM.yyyy - hh:mm:ss"), Value = x.Value }).ToArray()
    };

    return Json(result, JsonRequestBehavior.AllowGet);
}

能源网：

Active | Reactive | .... | ....

其他人：

我想用网格的默认值传递额外的参数（rangeType、meterType）。并创建新的网格值（colname、ColModels和data）。那么我如何才能做到这一切呢

它可以是一个返回网格colNames的方法，也可以是另一个返回网格数据的方法

我的意思是：

1. public Json GetGridOptions{ return colNames and colModels }
2. public Json GetGridData{ return GridData }

1. $.ajax { url : GetGridOptions }
2. $.grid { url : GetGridData }}

---

谢谢。

动态加载

colModel

和

colNames

在某些情况下是可行的。如果这样做，您将在自己的Ajax请求的

success

回调中创建网格。为了确保在第一次执行此操作，您应该另外使用（请参阅演示）

顺便说一下，您可以不使用and

colNames

，而是在中使用

label

属性。在这种情况下，jqGrid将为您生成

colNames

如果需要在处理前更改

loadComplete

或

中的列标题

，仅使用

setGridParam

和

colNames

是不够的，因为标题已经创建。因此，您必须手动修改列标题的文本。您可以使用这样一个事实，即列标题将由

的“jqgh_”

构造，网格id和

colModel

的

name

属性中的值

如果将

colNames

的值用在HTML格式中，如

My column Header Text

，将得到与使用

“My column Header Text”

相同的结果，但可以更容易地查找和修改标题

---

例如，如果使用，您仍然需要将

setGridParam

与

colNames

一起使用。

列选择器

从

colNames

读取当前值，并在相应的对话框中使用它。

是否希望在同一网格的不同页面上有不同的

colNames

？是。不同的页面，不同的列名。我的第一个问题是从服务器部分获取数据。我想，我可以根据获取的数据来刷新网格。你说的“部分获取数据”是什么意思？来自

GetGridData

的每个响应都包含来自

result

变量的完整JSON数据。小的附加备注：您应该使用

pager:“#gridpager”

而不是

pager:$（“#gridpager”）

并添加

gridview:true

选项，以提高性能。您可以使用

jsonReader:{repeatitems:false}

，因为您只更改属性。您不在响应的项中填充

id

。这些数据是否有一些本机的

id

？对不起，你能读一下我问题中的更新行吗。另外，谢谢你的建议。@AliRızaAdıyahşI:对不起，我不完全明白你在做什么。尤其是结果的分组尚不清楚。我不明白您想要显示什么数据以及如何显示。什么是文本

T1 | T2 | T3 ||或<代码>有功|无功|？它是网格的标题吗？显示数据的分页如何？您希望在网格中总共显示多少行。。。我很抱歉。这对我来说也很复杂：）。是的，它们是网格标题。我有超过一百万的数据。有电、水、气和电能表结果。若仪表类型是电的，我想显示T1、T2、T3，或者若仪表是电能，我想显示有功、无功、电容（以及更多列）。有DateRange和MeterType按钮。如果用户选择其中一个按钮，我想重新创建网格。@AliRızaAdıyahşI：如果只有两种（或其他）类型的网格，则可以创建所有网格。可以隐藏除一个网格之外的所有网格。如果隐藏或显示包含用于创建网格的
的外部div，则可以非常轻松地动态隐藏或显示网格。另一种选择是使用
GridUnload
abd重新创建。另外两个答案：并提供一些其他选项，可在某些场景中使用。