While converting ViewBag.JsonData from View in JavaScript, getting The length of the string exceeds the value set on the maxJsonLength property

Question

I'm working on a project where I've to pass a huge list of data (500 000 records or more) through ViewBag. From my controller, I'm sending data shown as below.

public ActionResult Index()
{
  var list = new List<DropdownList>();
    
  for (int i = 0; i < 500000; i++)
  {
     list.Add(new DropdownList() { id = i, text = "Test Data-" + i });
  }
  ViewBag.JsonData = JsonConvert.SerializeObject(list);
  return View();
}

And from my view, I'm using the following code to parse that data in JavaScript. While trying this code getting the maxJsonLength exceeds the error.

<script>
$(document).ready(function(){
   @Html.Raw(Json.Encode(@ViewBag.JsonData));
});
</script>

I also tried this & It's working with 500k records while data does not contain special characters. If data contain some special character then it's not working.

<script>
$(document).ready(function(){
   JSON.parse('@ViewBag.JsonData');
});
</script>

Note: I'm not getting error in .cs (c# code) file cause this solution already implemented in my project.

Does this answer your question? [MaxJsonLength exception in ASP.NET MVC during JavaScriptSerializer](https://stackoverflow.com/questions/5692836/maxjsonlength-exception-in-asp-net-mvc-during-javascriptserializer) — Oleg Naumov, Feb 10 '22 at 12:53
Oleg Naumov, No it’s not. It worked when error generating in c# code. But I'm getting error while Working viewbag data in cshtml file. — Raju Ahmed, Feb 10 '22 at 13:23
`500_000` items in a drop-down list seems like a *terrible* user experience. If the user can read and discard one item every second, it would take them nearly six days to work their way through the list. There must be a better option - for example, let the user start typing what they're looking for, and then load matching data on demand. Eg: [Select2's AJAX data source](https://select2.org/data-sources/ajax). — Richard Deeming, Feb 10 '22 at 13:34
Richard you are right. And I'm doing this for select2. And I've a purpose to do that though it’s it’s not right. — Raju Ahmed, Feb 10 '22 at 14:21

MD SHOHAG MIA · Accepted Answer · 2022-02-21T07:59:42.893

You are getting the error of MaxJsonLength overflow issues, This isn't a JavaScript issue but issues on C#. It doesn't support a large number of data sets in Json.Encode.

It's possible to tackle this situation only this way of a JavascriptSerializer and setting the MaxJsonLength property manually or only used by Newtonsoft.Json

C# Codes

public class HomeController : Controller
{
    public ActionResult Index()
    {
        var list = new List<DropdownList>();

        for (int i = 0; i < 2000000; i++)
        {
            list.Add(new DropdownList() { id = i, text = "Test Data-" + i });
        }            
        
        //First solutions with JavaScriptSerializer
        var serializer = new System.Web.Script.Serialization.JavaScriptSerializer() { MaxJsonLength = Int32.MaxValue };
        ViewBag.DataAsList = serializer.Serialize(list);

        //Second Solutions with Newtonsoft.Json
        ViewBag.DataAsList = JsonConvert.SerializeObject(list);

        return View();
    }
}

Razor Pages

 <script>
        $(document).ready(function () {
            function mockDataForDataAsList() {
                return @Html.Raw(ViewBag.DataAsList);
            }  
            console.log(mockDataForDataAsList());
        });
  </script>

Console Log

In this scenario, you can handle 2 million records within a few seconds. Hope you got your answers!

score 0 · Answer 2 · answered Feb 10 '22 at 15:48

You are getting the error in "C# code". This is not a JavaScript issue.

If editing web.config doesn't help, you can try using an instance of a JavascriptSerializer and setting the MaxJsonLength property manually:

@{
   var serializer = new JavaScriptSerializer() { MaxJsonLength = Int32.MaxValue };
    
   var jsonData = serializer.Serialize(@ViewBag.JsonData);
}

See more here and here.

While converting ViewBag.JsonData from View in JavaScript, getting The length of the string exceeds the value set on the maxJsonLength property

2 Answers2