Entity to json error MVC - A circular reference was detected while serializing an object of type

Question

My mvc app is using bootstrap table.

My model is my database table tSSTCodes which is accessed using Entity Framework

@ModelType IEnumerable(Of SupportDiary.tSSTCode)

I have used the same method for other tables and they all work (the table is generated) but this view returns an error:

A circular reference was detected while serializing an object of type 'System.Data.Entity.DynamicProxies.tSSTCode_8DE9547CF85FA0D8C54E713F4E2A7A2104EC7CB828A4B0F29604CE8AE871F8A3'.

The line at which it breaks is....

var tdata = @Html.Raw(Json.Encode(Model));

Model is a simple table. This is the sql to create it;

CREATE TABLE [dbo].[tSSTCodes](
    [sstID] [int] IDENTITY(1,1) NOT NULL,
    [sRU] [nvarchar](10) NOT NULL,
    [sProjectCode] [nvarchar](10) NOT NULL,
    [sProjectName] [nvarchar](50) NOT NULL,
    [sTaskNo] [nvarchar](10) NOT NULL,
    [sTaskName] [nvarchar](50) NOT NULL,
    [sRedundant] [bit] NOT NULL CONSTRAINT [DF_tSSTCodes_sRedundant]  DEFAULT ((0)),
 CONSTRAINT [PK_tSSTCodes] PRIMARY KEY CLUSTERED 
(
    [sstID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]

My Bootstrap Table code is

<table id="table"
    data-classes="table table-hover table-condensed"
    data-striped="true"
    data-toolbar="#toolbar"
    data-pagination="true"
    data-click-to-select="true"
    data-search="true"
    data-show-export="true"
    data-show-pagination-switch="true"
    data-show-toggle="true"
    data-show-columns="true" >
    <thead>
        <tr>
            <th data-field="sstID" data-formatter="btnViewFormatter">ID</th>
            <th data-field="sRU" >R/U</th>
            <th data-field="sProjectCode" >Project Code</th>
            <th data-field="sProjectName" >Project Name</th>
            <th data-field="sTaskNo" >Task No</th>
            <th data-field="sTaskName" >Task Name</th>
            <th data-field="sRedundant" data-formatter="trueFalseFormatter" >Redundant</th>
        </tr>
    </thead>
</table>

And the associated scripts are:

<script type="text/javascript">

var tdata = @Html.Raw(Json.Encode(Model));

console.log(tdata);

var $table = $('#table');  

function btnViewFormatter(value) {
    return '<a class="btn btn-default btn-sm" href="@Url.Content("~/SSTCodes/Edit?id=")' + value + '" >' + value + '</a>';
}

function trueFalseFormatter(value) {
    if (value == true){
        return '<span class="glyphicon glyphicon-check"></span>';
    } else {
        return '<span class="glyphicon glyphicon-unchecked"></span>';
    }
}

function getSelectedRow() {
    var index = $table.find('tr.success').data('index');
    return $table.bootstrapTable('getData')[index];
}

$(function () {

    $table.bootstrapTable({
        data: tdata,
        fixedColumns:    true,
        fixedNumber: 1,
        exportDataType:"all",
        exportTypes:['csv', 'txt', 'excel']
    });

    $table.on('click-row.bs.table', function (e, row, $element) {
        $('.success').removeClass('success');
        $($element).addClass('success');
    });

    $table.on('dbl-click-row.bs.table', function (e, row, $element) {
        var url = '@Url.Content("~/SSTCodes/Edit?id=")' + getSelectedRow().sstID;
        window.navigate(url);
    })

});

I cannot figure out what is causing the circular reference... In trying to debug I tried console.log(tdata); placed after the offending line but of course it does not get that far... so I tried console.log(@Html.Raw(Json.Encode(Model))); and got the same error at the console.log line.

UPDATE Links to a possible duplicate of another question are no help. My code was based on generating a new MVC controller using the ADO Entity Frameworks wizard template. This scaffolded a series of CRUD views. All I did then was replace the html table a for each item code with a bootstrap table helper. I have done this with several controllers and they all work.

Any help appreciated.

Answer 1

It seems that Entity Frameworks can have issues scaffolding where relationships are involved. In the case of this table I have had to create my own views and code.