【问题标题】:jqGrid does not show rowsjqGrid 不显示行
【发布时间】:2012-05-31 02:55:03
【问题描述】:

我正在尝试在 jqGrid (4.3.2) 中显示行但还没有成功。我的网络服务响应是:

{"d":
{"__type":"JSONResponse:pe",
 "ActionType":null,
 "JSONData":"
            {\"total\":1,
             \"page\":1,
             \"records\":5,
             \"rows\":[
                       {\"invid\":1,\"cell\":[{\"invid\":1,\"amount\":500,\"tax\":65,\"total\":565,\"note\":\"myNote 0\"}]},
                       {\"invid\":2,\"cell\":[{\"invid\":2,\"amount\":510,\"tax\":75,\"total\":585,\"note\":\"myNote 1\"}]},
                       {\"invid\":3,\"cell\":[{\"invid\":3,\"amount\":520,\"tax\":85,\"total\":605,\"note\":\"myNote 2\"}]},
                       {\"invid\":4,\"cell\":[{\"invid\":4,\"amount\":530,\"tax\":95,\"total\":625,\"note\":\"myNote 3\"}]},
                       {\"invid\":5,\"cell\":[{\"invid\":5,\"amount\":540,\"tax\":105,\"total\":645,\"note\":\"myNote 4\"}]}
                      ]
            }",
 "Status":false
}

}

我的网格配置如下所示:-

<script type="text/javascript">
    $(document).ready(function () {

        gridConfig();

    });

    function gridConfig() {
        var request = JSON.stringify(requestData());
        var jsonResponse;

        $("#list").jqGrid({
            url: '/ScriptServices/JsonService.svc/Process',
            ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
            datatype: 'json',
            postData: { request: function () { return request; } },
            mtype: 'GET',
            colNames: ['Inv No', 'Amount', 'Tax', 'Total', 'Notes'],
            colModel: [
                    { name: 'invid', index: 'invid', width: 55 },
                    { name: 'amount', index: 'amount', width: 80, align: 'right' },
                    { name: 'tax', index: 'tax', width: 80, align: 'right' },
                    { name: 'total', index: 'total', width: 80, align: 'right' },
                    { name: 'note', index: 'note', width: 150, sortable: false }
                  ],
            pager: $('#pager'),
            rowNum: 10,
            rowList: [10, 20, 30],
            sortname: 'invid',
            sortorder: 'desc',
            viewrecords: true,
            jsonReader: {
                root: "d.JSONData.rows",
                page: "d.JSONData.page",
                total: "d.JSONData.total",
                records: "d.JSONData.records",
                cell: "cell",
                id:0
            },
            caption: 'My first grid'
        });

    };

    function requestData() {
        var request;
        request = {
            ActionType: 'GET_GRID_DATA',
            RequestJSONData: '{ }'
        };
        return request;
    }

</script>

我无法找到问题所在。是否需要任何其他格式。请帮忙..

更新1:

现在我的数据在 Oleg 建议后以正确的 json 格式出现,但由于我的 json 数据中有 __type 额外字段,它无法正确呈现。

修改后的 json 数据如下:-

{
"d":
    {"__type":"JSONResponse:pe",
     "ActionType":"GRID_RESP",
     "JSONData":
                {"__type":"JQGridJSONReader:pe",
                "total":1,
                "page":1,
                "records":5,
                "rows":[
                        {"__type":"InvoiceGrid:pe",
                        "invid":1,
                        "cell":[{"__type":"JqGridCell:pe","invid":1,"amount":500,"tax":65,"total":565,"note":"myNote 0"}]},
                        .... and More Rows
                        ]
                },
     "Status":true
}

}

我已经检查了这个link 并实现了默认构造函数建议,protected internal 在我的情况下是不可能的。

我的服务配置如下所示:

<system.serviceModel>
    <services>
        <service name="JsonService" behaviorConfiguration="JsonServiceAspNetAjaxBehavior">
            <endpoint address="" behaviorConfiguration="JsonServiceEndPointBehavior"
                binding="webHttpBinding" contract="JsonService" />
        </service>
    </services>
    <behaviors>
        <endpointBehaviors>
            <behavior name="JsonServiceEndPointBehavior">
                <enableWebScript/>
              <dataContractSerializer ignoreExtensionDataObject="true" />
            </behavior>
        </endpointBehaviors>
        <serviceBehaviors>
            <behavior name="JsonServiceAspNetAjaxBehavior">
                <serviceMetadata httpGetEnabled="true"/>
                <serviceDebug includeExceptionDetailInFaults="true" />
            </behavior>
        </serviceBehaviors>
    </behaviors>
    <serviceHostingEnvironment aspNetCompatibilityEnabled="true"
        multipleSiteBindingsEnabled="true" />
</system.serviceModel>

如果我将&lt;webHttp/&gt; 应用于endpointBehaviors,我会收到“UriTemplate 查询值的变量必须具有可以由'QueryStringConverter' 转换的类型”错误。

我的 WebService 如下所示:-

[ServiceContract(Namespace = "http://www.abhishek.com/portal/json")]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class JsonService
{
    [OperationContract]
    [WebInvoke(Method = "GET", RequestFormat = WebMessageFormat.Json,
        ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.WrappedRequest)]
    [GenerateScriptType(typeof(JsonService), ScriptTypeId = "JsonService1")]
    public PresentationEntities.JSONResponse Process(PresentationEntities.JSONRequest request)
    {
        JSONResponse response;

        try
        {
            if (request == null)
            {
                throw new ArgumentNullException("request", string.Format(ExceptionHelper.ARG_NULL_EXP_MSG, "JSONManager"));
            }
            else
            {
                JQGridTransalator gridtransalator = new JQGridTransalator();
                response = gridtransalator.JQGridToJSONResponse(); // fill response.JSONData with JQGridJSONReader
            }
        }
        catch (Exception)
        {
            throw;
        }

        return response;
    }}

JQGridJSONReader 看起来像这样:-

[DataContract(Name = "JQGridJSONReader", Namespace = "pe")]
public class JQGridJSONReader
{
    public JQGridJSONReader()
    {

    }

    [DataMember(Name = "total", Order = 1)]
    public int Total { get; set; }

    [DataMember(Name = "page", Order = 2)]
    public int Page { get; set; }

    [DataMember(Name = "records", Order = 3)]
    public int Records { get; set; }

    [DataMember(Name = "rows", Order = 4)]
    public List<InvoiceGrid> Rows { get; set; }
}

从 json 数据中删除 __type 的任何建议。

更新2:

更新代码以便我可以更清楚地回答我的问题

[DataContract(Name = "InvoiceGrid", Namespace = "pe")]
public class InvoiceGrid
{
    [DataMember(Name = "cell", Order = 2)]
    public List<JqGridCell> Cell { get; set; }
}

[DataContract(Name = "JqGridCell", Namespace = "pe")]
public class JqGridCell
{
    [DataMember(Name = "invid", Order = 1)]
    public int Invid { get; set; }

    [DataMember(Name = "invdate", Order = 2)]
    public DateTime InvDate { get; set; }

    [DataMember(Name = "amount", Order = 3)]
    public double Amount { get; set; }

    [DataMember(Name = "tax", Order = 4)]
    public double Tax { get; set; }

    [DataMember(Name = "total", Order = 5)]
    public double Total { get; set; }

    [DataMember(Name = "note", Order = 6)]
    public string Note { get; set; }
}

【问题讨论】:

    标签: asp.net jqgrid wcf-rest


    【解决方案1】:

    您的错误是您将带有数据 d.JSONData 的对象从对象序列化为 JSON 两次。可能您手动使用了一些 JSON 序列化而不是使用对象,并允许 .NET 自行序列化数据。

    您如何查看无法访问像 d.JSONData.rows 这样的数据,因为 d.JSONData字符串 而不是具有 rows 属性的对象。

    【讨论】:

    • 我已经更正了我的 json 数据,现在它即将到来。但 __type 是我与影响我的 jsonReader 格式的 json 数据相处的额外字段。请参阅Update1
    • 我收到了错误。错误在 "cell":[{"__type":"JqGridCell:pe","invid":1,"amount":500,"tax":65,"total":565,"note":"myNote 0"}]}, 中。很快我将发布答案。感谢@Oleg 提示我如何将 .net 对象转换为 json 对象。
    • 是的,我手动使用 JSON 序列化。更正了。将来我可能永远不会这样做,因为 ASP.NET 在发送响应时已经为我服务了。 :)
    【解决方案2】:

    第一个错误更正:- 正如@Oleg 所建议的,我将 JSONData (为字符串格式)转换为 json 对象。这是由于在发送数据之前使用了 JSON 序列化。

    纠正第二个错误:-

    我的单元格类型是这样的:List&lt;GridData&gt; 和 GridData 有单元格内容(这是复杂类型,即 GridData)。所以我得到了这个

    "cell":[{"__type":"JqGridCell:pe","invid":1,"amount":500,"tax":65,"total":565,"n‌​ote":"myNote 0"}]}, 在这个单元格中,第一行是复杂类型。想象一下"cell":[{ComplexType}] 所以我在第一个单元格中得到了“[Object object]”,而其他单元格仍然是空的。

    因此将单元格类型更正为List&lt;string&gt;,将网格数据添加到其中,然后将单元格添加到List&lt;InvoiceGrid&gt;

            JQGridJSONReader input = new JQGridJSONReader();
            input.Page = 1;
            input.Total = 1;
            input.Records = 5;
    
            input.Rows = new List<InvoiceGrid>();
    
    
            for (int i = 0; i < 5; i++)
            {
                InvoiceGrid invGrid = new InvoiceGrid();
                invGrid.Cell = new List<string>();
                JqGridCell gridrows = new JqGridCell();
                gridrows.Invid = 1 + i;
                gridrows.Amount = 500.00 + (i * 10);
                gridrows.Tax = 65.00 + (i * 10);
                gridrows.Total = gridrows.Amount + gridrows.Tax;
                gridrows.Note = "myNote " + i.ToString();
                invGrid.Cell.Add(gridrows.Invid.ToString());
                invGrid.Cell.Add(gridrows.InvDate.ToString());
                invGrid.Cell.Add(gridrows.Amount.ToString());
                invGrid.Cell.Add(gridrows.Tax.ToString());
                invGrid.Cell.Add(gridrows.Total.ToString());
                invGrid.Cell.Add(gridrows.Note.ToString());
                input.Rows.Add(invGrid);
            }
    

    我在想这个错误是因为__type 作为额外的 json 数据。但似乎 jqGrid 忽略了这一点。

    我的 json 数据现在看起来像这样。 注意:- 这次我忽略了invid,但可以包括在内。

    {"d":
    {"__type":"JSONResponse:pe",
     "ActionType":"GRID_RESP",
     "JSONData":
                {"__type":"JQGridJSONReader:pe",
                 "total":1,
                 "page":1,
                 "records":5,
                 "rows":[
                        {"__type":"InvoiceGrid:pe",
                        "cell":["1","500","65","565","myNote 0"]},
                        {"__type":"InvoiceGrid:pe",
                        "cell":["2","510","75","585","myNote 1"]},
                        {"__type":"InvoiceGrid:pe",
                        "cell":["3","520","85","605","myNote 2"]},
                        {"__type":"InvoiceGrid:pe",
                        "cell":["4","530","95","625","myNote 3"]},
                        {"__type":"InvoiceGrid:pe",
                        "cell":["5","540","105","645","myNote 4"]}
                        ]
                },
     "Status":true
    }}
    

    非常感谢@Oleg。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2011-04-16
      • 2012-09-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多