1
У меня есть огромные данные для отображения на моей странице. Я хочу сделать это так же, как это делается на странице facebook, т. Е. Я прокручивать вниз вертикальную полосу и детали будут added.I получил один веб-ссылку для этого и использовали его код следующим образом: -Как продолжать прокрутку страницы по вертикали и добавление элементов непрерывно?
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Form1.aspx.cs" Inherits="Form1" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
DataSet ds = new DataSet();
SqlConnection conn = new SqlConnection("my connection string");
string _cmdText = "SELECT TOP 20 TRIAL_USER_DETAIL_ID, Convert(CHAR(10),TRIAL_ACTIVATE_DATE,103) as 'ACTIVATEDATE',TRIAL_CD_SERIAL_NO FROM TDSMAN_TRIAL_USER_DETAIL";
SqlDataAdapter da = new SqlDataAdapter(_cmdText, conn);
da.Fill(ds, "User_Detail");
tblUserDetail.DataSource = ds;
tblUserDetail.DataBind();
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Dynamic Content Load on Scroll</title>
<style type="text/css">
body
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
}
.divLeft
{
height: 220px;
border: solid 1px blue;
width: 300px;
text-align: left;
overflow: auto;
}
.divProgress
{
width: 15%;
background-color: red;
color: white;
}
.tblHeader
{
font-weight: bold;
text-align: left;
background-color: blue;
color: red;
}
td
{
text-align:center;
}
</style>
<script src="Scripts/jquery-1.2.6.js" type="text/javascript"></script>
<script type="text/javascript">
//following code utilizes jQuery 1.2.6
var prev = 0;
$(document).ready(
//DIV showing the message "Loading..." is hidden initially
//The message will be shown when records are fetched with AJAX
//when user has scrolled to the bottom of the DIV scrollbar
function() {
$(".divProgress").hide();
$(".divLeft").scroll(
function() {
//triggering point is when the difference of the heights of the TABLE
//and DIV match the DIV's scrollTop value
if ($("#tblUserDetail").height() - this.scrollTop == $(this).height()) {
//progress bar
$(".divProgress").ajaxStart(function() {
$(this).show();
});
$(".divProgress").ajaxStop(function() {
$(this).hide();
});
//get last Order Id to track next fetch
var OrderIdLast = $("#tblUserDetail tr:last").children("td:first").html();
//get last table row in order to append the new result set increment
var trLast = $("#tblUserDetail tr:last");
if (parseInt(OrderIdLast, 10) > parseInt(prev, 10)) {
prev = OrderIdLast;
//make a async call to fetch the incremental results
$.post("AsyncHandler.ashx?lastOrderId=" + OrderIdLast, function (data) {
if (data != null) {
//append new result set to last row
trLast.after(data);
}
});
}
}
});
});
</script>
</head>
<body>
<h3>This is a demo to show Continous Scrolling</h3>
<form id="form1" runat="server">
<div class="divLeft">
<asp:GridView ID="tblUserDetail" runat="server" AutoGenerateColumns="false" CellPadding="2" Width="100%">
<HeaderStyle CssClass="tblHeader" />
<Columns>
<asp:TemplateField HeaderText="Detail Id">
<ItemTemplate>
<%#Eval("TRIAL_USER_DETAIL_ID")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Activate Date">
<ItemTemplate>
<%# Eval("ActivateDate")%>
<input type="hidden" id="htxtOrderId" runat="server" value='<%#Eval("TRIAL_USER_DETAIL_ID")%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="CD Serial No.">
<ItemTemplate>
<%#Eval("TRIAL_CD_SERIAL_NO")%>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<div class="divProgress">
Loading....
</div>
</form>
</body>
</html>
Я представил обработчик и его код выглядит следующим образом: - -
<%@ WebHandler Language="C#" Class="AsyncHandler" %>
using System;
using System.Web;
using System.Text;
using System.Data;
using System.Data.SqlClient;
public class AsyncHandler : IHttpHandler {
public void ProcessRequest (HttpContext context) {
//context.Response.ContentType = "text/plain";
//context.Response.Write("Hello World");
//REMOVE BELOW LINE if you are using it in a real application
//It is here to simulate the delay while fetching results
//System.Threading.Thread.Sleep(2000);
//The last OrderId is used to get the next increment
int lastOrderId = Convert.ToInt32(context.Request.QueryString["lastOrderId"]);
//The PrepareDataSet method stuffs the DataSet into a HTML table
context.Response.Write(PrepareDataSet(lastOrderId));
}
private string PrepareDataSet(int LAST_TRIAL_USER_DETAIL_ID)
{
System.Data.SqlClient.SqlConnection conn = new SqlConnection("my connection string");
string _cmdText = "Select TOP 10 TRIAL_USER_DETAIL_ID,Convert(Varchar,TRIAL_ACTIVATE_DATE,103) ActivateDate,TRIAL_CD_SERIAL_NO From TDSMAN_TRIAL_USER_DETAIL Where TRIAL_USER_DETAIL_ID >" + LAST_TRIAL_USER_DETAIL_ID;
SqlDataAdapter da = new System.Data.SqlClient.SqlDataAdapter(_cmdText, conn);
DataSet ds = new System.Data.DataSet();
da.Fill(ds, "User_Detail");
//The BuildRows method prepares a HTML table & stuffs the resultset into it
return BuildRows(ds.Tables[0]);
}
private string BuildRows(System.Data.DataTable dt)
{
StringBuilder sb = new StringBuilder();
System.Data.DataRow dr;
if (dt.Rows.Count > 0)
{
for (int i = 0; i < dt.Rows.Count; i++)
{
sb.Append("<tr class='tblRow'>");
dr = dt.Rows[i];
for (int j = 0; j < dt.Columns.Count; j++)
{
sb.Append("<td>" + dr[j] + "</td>");
}
sb.Append("</tr>");
}
}
return sb.ToString();
}
public bool IsReusable
{
get {
return false;
}
}
}
Теперь, когда я запускаю код сетка показана на моей странице с данными в it.but, когда я прокручиваю вниз, ни «Loading ..» показано, ни следующая партия данных не заполняется в сетке .У вас есть какая-то идея, как это решить?
@ Paesmaker, функция записывается в обработчик (как я уже говорил в моем коде выше) .При Я копирую отредактированный код, это дает ошибку как «Имя _cache не существует в текущем контексте», также ошибка для идентификатора gridview, tblUserDetail.Что является «ключом для предыдущих данных в кеше»? «TRIAL_USER_DETAIL_ID»? – Sukanya