JQGrid is working fine for records up to 3000 and so with loadone:true , while it comes to more than 3200 it is showing empty grid. I would like to take up with server side paging and loadonce:false. is there any better way to load the data loadonce:true and show some huge amount of data like 20k records? if we are going to use server side paging, we should fetch only specific amount of records from database ? please find my code below and point me if any issues.
Model:
public class GOALogging
{
public int SERV_TRANS_ID { get; set; }
public string ACT_YEAR { get; set; }
public string SEAS { get; set; }
public string RESPONSE_DT { get; set; }
}
Controller
public ActionResult Index()
{
return View();
}
public JsonResult getRecords()
{
List<GOALogging> items = new List<GOALogging>();
items = GetLoggingDetails();
var a = Json(items, JsonRequestBehavior.AllowGet);
return a;
}
public List<GOALogging> GetLoggingDetails()
{
string connString = ConfigurationManager.ConnectionStrings["ACTOLConnection"].ConnectionString;
SqlConnection conn = new SqlConnection(connString);
SqlCommand cmd = new SqlCommand();
cmd.CommandType = CommandType.StoredProcedure;
cmd.CommandTimeout = 6000;
cmd.CommandText = "GET_SAMPLEDETAILS";
cmd.Connection = conn;
conn.Open();
DataTable dataTable = new DataTable();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dataTable);
conn.Close();
da.Dispose();
List<GOALogging> items = new List<GOALogging>();
foreach (DataRow row in dataTable.Rows)
{
items.Add(new GOALogging
{
SERV_TRANS_ID = Convert.ToInt32(row["SERV_TRANS_ID"]),
ACT_YEAR = row["ACT_YEAR"].ToString(),
SEAS = row["SEAS"].ToString(),
RESPONSE_DT = row["RESPONSE_DT"].ToString()
});
}
return items;
}
View
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Scripts/grid.locale-en.js"></script>
<script src="~/Scripts/jquery-1.11.0.min.js"></script>
<link href="~/Scripts/lib-UI-jquery-css-custom-theme-jquery-ui-1.9.2.custom.css" rel="stylesheet" />
<script src="~/Scripts/jquery.jqGrid.js"></script>
<script src="~/Scripts/grid.locale-en.js"></script>
<link href="~/Scripts/ui.jqgrid.css" rel="stylesheet" />
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/base/jquery-ui.css" rel="stylesheet" />
</head>
<body>
<script type="text/javascript">
$(function () {
$("#myGrid").jqGrid({
url: '/GOA/getRecords',
datatype: 'json',
myType: 'GET',
colNames: ['ID',
'YEAR', 'SEASON', 'RESPONSE_DT'],
colModel: [
{ name: 'SERV_TRANS_ID' },
{ name: 'ACT_YEAR' },
{ name: 'SEAS' },
{ name: 'RESPONSE_DT' }
],
pager: $('#myPager'),
jsonReader: { cell: ""},
rowNum: 10,
sortname: 'SERV_TRANS_ID',
sortorder: 'desc',
gridview: true,
loadonce: true,
rowList: [10, 20, 50, 100],
width:1120,
height:280,
viewrecords: true,
caption: 'Past 24 hours ACTService Processing Status'
});
});
</script>
<div >
<table id="myGrid" ></table>
<div id="myPager"></div>
</div>
</body>
</html>
This is because of Maximum length restriction in .Net, you can use below formated code in your controller to go ahead of issue.
List<MEmployee> items = new List<MEmployee>();
items = getData();
var a = Json(items, JsonRequestBehavior.AllowGet);
a.MaxJsonLength = int.MaxValue;
return a;