如何在局部视图（ASP.NET MVC）中使用 DevExtreme？答案

【问题标题】：How to use DevExtreme in partial view (ASP.NET MVC)?如何在局部视图（ASP.NET MVC）中使用 DevExtreme？
【发布时间】：2018-02-26 06:24:25
【问题描述】：

我尝试在局部视图中使用 DevExtreme 组件。但是当我点击元素时会显示我的部分视图页面。

点击后在主页出现错误

Newtonsoft.Json.JsonSerializationException: Self referencing loop detected for property 'ApplicationEntity' with type 'System.Data.Entity.DynamicProxies.ApplicationEntity_50A6A66F1464C1DE4E8A736E85D88C5AF4F4249EAE26FB21C4F82592E001885D'. Path 'data[0].ApplicationEntity.ApplicationEntityHistories[0]'.

browser console screen

主页代码：

<div class="row">
<div class="col-md-7">
   <button id="btn">CLICK</button 

</div>
<div class="col-md-5" id="divPartialViewContainer">

</div>
</div>
<script>
$(document).ready(function () {

    $("#btn").on("click", function () {
        var text = $(this).text().trim();
        if (text.length > 0) {
            console.log(text);
            $.ajax({
                url: '/RiskMap/RiskDetailsPartial/',
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify({ 'param': text }),
                success: function (content) {
                    $('#divPartialViewContainer').html(content);
                },
                error: function (e)
                {
                    console.log(e);
                }
            });
        }
       });

     });
 </script>

控制器代码

[HttpPost]
public async Task<ActionResult> RiskDetailsPartial(string param)
{          
  return PartialView("_RiskDetails", new List<Risk>());
}

部分查看代码：

@model IEnumerable<Core.Models.Risk>
@using Core.Models
@using Core.ComplexTypes
@{
   ViewBag.Title = "Risks";
}

<h2>Risks</h2>

@(Html.DevExtreme().DataGrid<Risk>()
    .DataSource(Model)
    .Columns(columns =>
    {
        columns.AddFor(m => m.Id);
        columns.AddFor(m => m.Impact);
        columns.AddFor(m => m.Probability);

    })
  )

【问题讨论】：

您的项目中有 Newtonsoft DDL 吗？
您的项目中有 Newtonsoft DDL 吗？是的
google.co.uk/… 您是否使用实体框架类作为模型？
是的，我在我的 WebApiConfig 类中添加了这个 config.Formatters.JsonFormatter.SerializerSettings.ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore;，但它没有帮助
@SamatYeshernkulov 如果ReferenceLoopHandling.Ignore 不能帮助检查我的answer to a similar question 中建议的其他选项。

标签： javascript c# ajax asp.net-mvc devextreme

【解决方案1】：

信息很清楚，您只需仔细阅读即可。

Newtonsoft.Json.JsonSerializationException：自引用循环检测到具有类型的属性“ApplicationEntity” 'System.Data.Entity.DynamicProxies.ApplicationEntity_50A6A66F1464C1DE4E8A736E85D88C5AF4F4249EAE26FB21C4F82592E001885D'。路径“数据[0].ApplicationEntity.ApplicationEntityHistories[0]”。

Json 序列化程序正在尝试序列化您传递给它的某种实体（我们称之为 EntityA），但问题是该实体包含另一个实体（我们称之为 EntityB) 包含第一个实体 (EntityA)。这是在绕圈子！

这也发生在我自己的 ORM 上，我发现问题是延迟加载。我通过为我的每个实体添加一个接口来解决它：

interface IJSonify
{
   object Json();
}

这里我只是简单地返回一个匿名对象。实现此接口的实体决定它将如何将自己表示为 JSON 对象。

【讨论】：

【解决方案2】：

我遇到了同样的问题，我通过在 webApplication init 上声明 JsonConvert defaultSettings 解决了这个问题。

JsonConvert.DefaultSettings = () => new JsonSerializerSettings
{
        Formatting = Newtonsoft.Json.Formatting.Indented,
        ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore
};

显然 DevExtreme 没有在 DataSourceLoader.Load(..) 方法中使用标准的 ASP.NET MVC json 序列化器，所以如果你设置 ASP.NET MVC json 序列化器 ReferenceLoopHandling 设置是不够的。

另一种解决方案是在生成循环引用的属性上方使用 [JsonIgnore] dataAnnotation

【讨论】：