Script error throws for exceeding maxJsonLength while performing serialization or deserialization
Problem:
While binding very large data to the grid it throws a following exception.
Error during serialization or deserialization using the JSON JavaScriptSerializer. The length of the string exceeds the value set on the maxJsonLength property.
Cause:
In our latest MVC grid, we have rendered all the html elements in client side and we have passed the data to the control from server side to client side as Json data by serializing it.
And we have used the default MaxJsonLength value (2097152 characters, which is equivalent to 4 MB of Unicode string data) of the JavaScriptSerializer which is a fixed universal standard length for serializing the data.
Solution:
1. By Serializing the JSON data
Serialize the JSON data before send the response from server side. Please refer to the following response for avoiding the MaxJsonLength serialization issue,
2. Using WebMethodAdaptor
Use WebMethodAdaptor to bound the Grid datasource. Use the WebMethodAdaptor to get the data from the controller through post action and bound the Json result as a grid data source.
Aspx
<ej:Grid ID="FlatGrid" runat="server" AllowPaging="true" AllowGrouping="true" AllowFiltering="true" AllowSorting="true">
<DataManager URL="WebMethodAdaptor.aspx/UrlDataSource" UpdateURL="WebMethodAdaptor.aspx/UrlUpdate" InsertURL="WebMethodAdaptor.aspx/UrlInsert" RemoveURL="WebMethodAdaptor.aspx/UrlDelete" Adaptor="WebMethodAdaptor" />
<EditSettings AllowEditing="True" AllowAdding="True" AllowDeleting="True"></EditSettings>
<ToolbarSettings ShowToolbar="true" ToolbarItems="add,edit,delete,update,cancel,search"></ToolbarSettings>
<Columns>
<ej:Column Field="OrderID" HeaderText="Order ID" IsPrimaryKey="True" TextAlign="Right" Width="75" />
<ej:Column Field="CustomerID" HeaderText="Customer ID" Width="80" />
<ej:Column Field="EmployeeID" HeaderText="Employee ID" TextAlign="Right" Width="75" />
<ej:Column Field="Freight" HeaderText="Freight" TextAlign="Right" Width="75" EditType= "Numeric" Format="{0:C}" />
<ej:Column Field="ShipCity" HeaderText="Ship City" Width="110"/>
</Columns>
</ej:Grid>
C#
namespace WebSampleBrowser.Grid
{
public partial class WebMethodAdaptor : System.Web.UI.Page
{
public static List<Orders> order = null;
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static object UrlDataSource(DataManager value)
{
IEnumerable data = BindDataSource();
DataOperations ds = new DataOperations();
if (value.Where != null && value.Where.Count > 0) //Filtering
{
data = ds.PerformWhereFilter(data, value.Where, value.Where[0].Operator);
}
if (value.Search != null && value.Search.Count > 0) // Searching
{
data = ds.PerformSearching(data, value.Search);
}
var count = data.AsQueryable().Count();
if (value.Sorted != null && value.Sorted.Count > 0) //Sorting
{
data = ds.PerformSorting(data, value.Sorted);
}
List<string> str = new List<string>();
if (value.Aggregates != null) // Summary
{
for (var i = 0; i < value.Aggregates.Count; i++)
str.Add(value.Aggregates[i].Field);
}
IEnumerable aggregates = ds.PerformSelect(data, str);
data = ds.PerformSkip(data, value.Skip); //Paging
data = ds.PerformTake(data, value.Take);
return new { result = data, count = count, aggregate = aggregates };
}
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static void UrlUpdate(Orders value)
{
Orders result = order.Where(o => o.OrderID == value.OrderID).FirstOrDefault();
if (result != null)
{
result.OrderID = value.OrderID;
result.OrderDate = value.OrderDate;
result.CustomerID = value.CustomerID;
result.EmployeeID = value.EmployeeID;
result.Freight = value.Freight;
result.ShipCity = value.ShipCity;
}
}
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static object UrlInsert(Orders value)
{
order.Insert(0, value);
return order;
}
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static object UrlDelete(int key)
{
Orders result = order.Where(o => o.OrderID == key).FirstOrDefault();
order.Remove(result);
return order;
}
public static List<Orders> BindDataSource()
{
if (order == null)
{
order = new List<Orders>();
int orderId = 10000;
int empId = 0;
for (int i = 1; i < 9; i++)
{
order.Add(new Orders(orderId + 1, "VINET", empId + 1, 32.38, new DateTime(2014, 12, 25), "Reims"));
order.Add(new Orders(orderId + 2, "TOMSP", empId + 2, 11.61, new DateTime(2014, 12, 21), "Munster"));
order.Add(new Orders(orderId + 3, "ANATER", empId + 3, 45.34, new DateTime(2014, 10, 18), "Berlin"));
order.Add(new Orders(orderId + 4, "ALFKI", empId + 4, 37.28, new DateTime(2014, 11, 23), "Mexico"));
order.Add(new Orders(orderId + 5, "FRGYE", empId + 5, 67.00, new DateTime(2014, 05, 05), "Colchester"));
orderId += 5;
empId += 5;
}
}
return order;
}
[Serializable]
public class Orders
{
public Orders()
{
}
public Orders(int orderId, string customerId, int empId, double freight, DateTime orderDate, string shipCity)
{
this.OrderID = orderId;
this.CustomerID = customerId;
this.EmployeeID = empId;
this.Freight = freight;
this.OrderDate = orderDate;
this.ShipCity = shipCity;
}
public int? OrderID { get; set; }
public string CustomerID { get; set; }
public int? EmployeeID { get; set; }
public double? Freight { get; set; }
public DateTime? OrderDate { get; set; }
public string ShipCity { get; set; }
}
}
}
The result will be as follows.
Figure 1: Shows the Grid rendered by binding data using WebMethodAdaptor.
