Набор данных Jquery Datatable ASP.NET Gridview Большой набор данных
Я использую "DataTables Jquery" с ASP.NET Gridview...
Вид сетки отлично работает для небольших наборов данных, но для больших наборов данных (>5000 строк) загрузка занимает некоторое время, и пока сетка загружается, круг загрузки также не отображается..
ASP.NET PseudoCode -
<body id="dt_example">
<form runat=server>
<asp:GridView ID="gv" runat="server" CellPadding="5" CellSpacing="5">
<RowStyle Wrap="False" />
</asp:GridView>
</form>
</body>
JavaScript -
<script type='text/javascript' charset='utf-8'>
$(document).ready(function () {
$('#gv').dataTable({
'bJQueryUI': true,
'sPaginationType': 'full_numbers',
'bAutoWidth': true
});
});
</script>
Код позади -
protected void Page_Load(object sender, EventArgs e)
{
QueryRslt(passType, val);
gv.HeaderRow.TableSection = TableRowSection.TableHeader;
}
public void QueryRslt(string Type, string Value)
{
if (!string.IsNullOrEmpty(Type))
{
if (Type == "TaskStatus")
{
gv.DataSource = tsk
.Where(x => x.Status == Value)
.Select(m => new
{
ID = m.Incident_ID,
TaskID = m.Task_ID,
CI = m.CI,
Status = m.Status,
Priority = m.Priority,
ReportedDate = m.Task_Assign_Time,
AssigneeGroup = m.Assignee_Group,
AssignedGroup = m.Assigned_Group,
RespondDate = m.Incident_Responded_Date,
Reason = m.Status_Reason
}).ToList();
gv.DataBind();
}
else if (Type == "IncidentStatus")
{
gv.DataSource = inc
.Where(x => x.Status == Value)
.Select(m => new
{
ID = m.Incident_ID,
CI = m.CI,
Status = m.Status,
Priority = m.Priority,
ReportedDate = m.Incident_Reported_Date,
AssigneeGroup = m.Assignee,
AssignedGroup = m.Assigned_Group,
RespondDate = m.Incident_Responded_Date,
Reason = m.Status_Reason
}).ToList();
gv.DataBind();
}}}
Загрузка Gif появляется на долю секунды, а затем исчезает...
Итак, есть 2 вещи, которые я хочу знать -
Показывать загрузку GIF, пока не будет заполнен весь вид сетки.
Уменьшить время обработки данных.
1 ответ
Вы можете использовать общие обработчики ASP.NET вместо привязки ASP.NET GridView в коде позади.
лайк
$('#gv').dataTable({
'bJQueryUI': true,
'sPaginationType': 'full_numbers',
'bAutoWidth': true,
'bProcessing': true,
'bServerSide': true,
'sAjaxSource': '/handlers/handlerName.ashx'
});
и обработчик содержит
public class handlerName : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
try
{
// THOSE PARAMETERS ARE SENT BY THE PLUGIN
var iDisplayLength = int.Parse(context.Request["iDisplayLength"]);
////HOLD DISPLAY START
var iDisplayStart = int.Parse(context.Request["iDisplayStart"]);
////HOLD SORT COLUMN
var iSortCol = int.Parse(context.Request["iSortCol_0"]);
////HOLD SORT DIRECTION SUCH AS ASC AND DESC
var iSortDir = context.Request["sSortDir_0"];
////HOLD SEARCH KEYWORD
var sSearch = context.Request["sSearch"];
var variableToHoldData = className.functionName();
// DEFINE AN ORDER FUNCTION BASED ON THE ISORTCOL PARAMETER
Func<variableToHoldData, object> order = p =>
{
//IF SORT COLUMN IS 1, fieldName
if (iSortCol == 1)
{
return p.fieldName2;
}
// //IF SORT COLUMN IS 2, SORT BY fieldName
else if (iSortCol == 2)
{
return p.fieldName3;
}
}
//SORT BY fieldName
return p.fieldName1;
};
// DEFINE THE ORDER DIRECTION BASED ON THE ISORTDIR PARAMETER
variableToHoldData = "desc" == iSortDir ? variableToHoldData.OrderByDescending(order) : variableToHoldData.OrderBy(order);
// PREPARE AN ANONYMOUS OBJECT FOR JSON SERIALIZATION
var result = new
{
iTotalRecords = variableToHoldData.Count(),
iTotalDisplayRecords = variableToHoldData.Count(),
aaData = variableToHoldData
//SEARCH BY FIELD NAME
.Where(p => p.fieldName1.ToLower().Contains(sSearch.ToLower()) || p.fieldName2.ToLower().Contains(sSearch.ToLower()) || p.fieldName3.ToLower().Contains(sSearch.ToLower()) )
//SELECT FIELDS
.Select(p => new[] { p.fieldName1.ToString(), p.fieldName2.ToString(), p.fieldName3.ToString() })
.Skip(iDisplayStart)
.Take(iDisplayLength)
};
var serializer = new JavaScriptSerializer();
//CONVERT RESULT INTO JSON
var json = serializer.Serialize(result);
context.Response.ContentType = "application/json";
context.Response.Write(json);
}
catch (Exception)
{
throw;
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
public class className
{
public string fieldName1 { get; set; }
public string fieldName2 { get; set; }
public string fieldName3 { get; set; }
public static IEnumerable<className> functionName()
{
//RETURN DATA FROM SOURCE
DT= obj.ReturnData();
//CHECK CANDIDATE PROFILE DATATABLE IS NULL
if (DT != null && DT.Rows.Count > 0)
{
foreach (DataRow row in DT.Rows)
{
yield return new className
{
fieldName1 = row["columnName1"].ToString(),
fieldName1 = row["columnName2"].ToString(),
fieldName1 = row["columnName3"].ToString(),
};
}
}
}
}
}