load data in datalist while scrolling in asp.net 4.0

Question

i am using datalist , and i want to load more data from database , when scroll touches the bottom , i read many many articles but in all articles their is no description how to write javascript code for datalist,  i am using datalist below

 

<asp:DataList ID="SQuestionsDataList" Width="100%" runat="server" OnItemCommand="SQuestionsDataList_ItemCommand"

OnItemDataBound="SQuestionsDataList_ItemDataBound">

<ItemTemplate>

<asp:UpdatePanel ID="UpdatePanel5" runat="server" UpdateMode="Conditional">

<ContentTemplate>

<div class=" col-lg-12 img-thumbnail" style="padding:5px; border-radius:0px; background-color:White; border-top-style:ridge; border-top-color:#428bca; border-top-width:3px;">

<div class="col-lg-12 paddingZero">

<div class="col-lg-2 paddingZero" style="width:58px;">

<a href="<%# writeurl(Eval("sfname").ToString() ,Eval("slname").ToString() , Eval("sid").ToString()) %>"

>

<asp:Image ID="Image3" class="imgpro" ImageUrl='<%# "Handler2.ashx?sid=" + Eval("sid")%>'

Width="50px" Height="50px" runat="server" />

</a>

</div>

<div class="col-lg-10 paddingZero forecolorofTitlesOfPost">

<div class="col-lg-7 paddingZero">

<strong><a href="<%# writeurl(Eval("sfname").ToString() ,Eval("slname").ToString() , Eval("sid").ToString()) %>" class="forecolorofTitlesOfPost"

style="text-decoration: none;">

<asp:Label ID="Label10" runat="server" ToolTip='<%# Eval("sfname") %>' Text='<%# Eval("pagename") %>'></asp:Label>

<asp:Label ID="Labelid" runat="server" Visible="false" Text='<%# Eval("Qid") %>'></asp:Label>

<asp:Label ID="Label3" runat="server" Visible="false" Text='<%# Eval("Uid") %>'></asp:Label>

</a>

<br />

</strong>Posted On

<asp:Label ID="Label11" class="timeago forecolorofTitlesOfPost" runat="server" Text='<%# Eval("SystemDate")%>'></asp:Label>

</div>

<div class="col-lg-3 paddingZero">

<asp:Button ID="Button8" BackColor="Transparent" CommandName="DeleteTileFromTimeline"

BorderStyle="None" Font-Size="10px" runat="server" Text="Delete" />

<asp:Button ID="Button14" BackColor="Transparent" CommandName="PostReport"

BorderStyle="None" Font-Size="10px" runat="server" Text="Report" />

</div>

</div>

</div>

<div class="col-lg-12 paddingZero" style="padding-top:5px;">

<a href="<%# writeurl1(Eval("Qid").ToString() ,Eval("Uid").ToString()) %>" style="color: Black;">

<asp:Label ID="SQuestions" runat="server" class="img-thumbnail" Font-Size="20px"

Style="border-radius: 0px; border-style: none; width:400px; font-family: garamond;

word-wrap: break-word; white-space: normal;" Text='<%# Eval("Heading") %>'></asp:Label>

</a><a href="<%# writeurl1(Eval("Qid").ToString() ,Eval("Uid").ToString()) %>">

<asp:Image ID="Image2" class="img-thumbnail" Style="border-radius: 0px; border-style: none;"

runat="server" Width="100%" ImageUrl='<%# "Handler.ashx?QID=" + Eval("QID")%>' />

</a>

</div>

<div class="col-lg-12 paddingZero">

<a href="<%# writeurl1(Eval("Qid").ToString() ,Eval("Uid").ToString()) %>">

<table>

<tr>

<td>

<asp:Image ID="AImage1" class="img-rounded" Style="object-fit: cover;" Width="100%"

Height="" runat="server" ImageUrl='<%# "Handler.ashx?QID=" + Eval("QID")%>' />

</td>

<td>

<asp:Image ID="AImage2" class="img-rounded" Style="object-fit: cover;" Width="100%"

Height="" runat="server" ImageUrl='<%# "AHandler1.ashx?QID=" + Eval("QID")%>' />

</td>

</tr>

<tr>

<td>

<asp:Image ID="AImage3" class="img-rounded" Style="object-fit: cover;" Width="100%"

Height="" runat="server" ImageUrl='<%# "AHandler2.ashx?QID=" + Eval("QID")%>' />

</td>

<td>

<asp:Image ID="AImage4" class="img-rounded" Style="object-fit: cover;" Width="100%"

Height="" runat="server" ImageUrl='<%# "AHandler3.ashx?QID=" + Eval("QID")%>' />

</td>

</tr>

</table>

</a>

</div>

<asp:HyperLink ID="HyperLink1" class="img-thumbnail" runat="server" NavigateUrl='<%# Eval("Question") %>'>

<div class="col-lg-12 img-thumbnail paddingZero">

<asp:Image ID="Image4" class="img-rounded" Style="object-fit: cover; float: left;"

runat="server" Width="100px" Height="100px" ImageUrl='<%# "Handler.ashx?QID=" + Eval("QID")%>' />

<asp:Label ID="Label24" runat="server" Font-Size="20px" Style="font-family: garamond;"

Text='<%# Eval("Heading").ToString().Length > 150?(Eval("Heading") as string).Substring(0,150) + "...":Eval("Heading") %>'></asp:Label>

</div>

</asp:HyperLink>

<%--

<asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<div class="col-lg-12" style="padding:0px;">

<asp:LinkButton ID="VideoLinkButton" runat="server">

<a class="player data-embed=false" style="height:300px; width:100%; display:block;" href='<%# Eval("Qid", "FileCS.ashx?Qid={0}") %>'>

<img src="img/berry/bk-berry.jpg" alt="Video" style=" width:100%; height:300px; font-size:20px;" />

</a>

</asp:LinkButton>

</div>

</ContentTemplate>

</asp:UpdatePanel>--%>

<div style="color: black; padding-left: 4px; padding-right: 4px;">

<div>

<table width="100%">

<tr>

<td width="12%">

<asp:DataList ID="DataList7" Style="float: left;" DataSourceID="SqlDataSource5" runat="server"

OnItemCreated="DataList7_ItemCreated">

<ItemTemplate>

<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<asp:Label ID="UnLabel" class="glyphicon glyphicon-check forecolorofTitlesOfPost" runat="server"

Text=""></asp:Label>

</ContentTemplate>

</asp:UpdatePanel>

</ItemTemplate>

</asp:DataList>

<asp:Button ID="LikeButton" class="forecolorofTitlesOfPost" runat="server" BackColor="Transparent" Style="margin-left: -8px;"

BorderStyle="None" CommandName="TakeIDForLike" Text="True" />

</td>

<td width="88%">

<asp:DataList ID="DataList8" class="forecolorofTitlesOfPost" Font-Size="14px" DataSourceID="SqlDataSource5"

runat="server">

<ItemTemplate>

<asp:UpdatePanel ID="DateOFTrueUpdatePanel" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<strong>You True This On

<asp:Label ID="Label16" runat="server" Text='<%# Eval("LikeDate") %>'></asp:Label>

</strong>

</ContentTemplate>

</asp:UpdatePanel>

</ItemTemplate>

</asp:DataList>

</td>

</tr>

</table>

</div>

</div>

<div class="backgroundandForeStripOfVerifyandcomment" style="font-size: 15px;

padding-left: 2px;">

<asp:DataList ID="DataList6" runat="server" DataSourceID="SqlDataSource4" OnItemCommand="DataList6_ItemCommand">

<ItemTemplate>

<asp:UpdatePanel ID="UpdatePanel4" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<a href="<%# LikersUrl(Eval("Qid").ToString()) %>" style="text-decoration: none;

color: White;">

<asp:Label ID="Label14" runat="server" Text='<%# Eval("LikeCounter") %>'></asp:Label>

people verify this post as True &nbsp;</a> <a href="<%# writeurl1(Eval("Qid").ToString() ,Eval("Uid").ToString()) %>"

style="text-decoration: none; color: White">

<asp:Label ID="Label15" runat="server" Text='<%# Eval("CommentCounter") %>'></asp:Label>

<span class="glyphicon glyphicon-comment"></span> Comments </a>&nbsp;&nbsp;<asp:LinkButton ID="LinkButton1" ForeColor="White" CommandName="Refresh"

Text="Refresh" runat="server"></asp:LinkButton>

</ContentTemplate>

</asp:UpdatePanel>

</ItemTemplate>

</asp:DataList>

<asp:SqlDataSource ID="SqlDataSource5" runat="server" ConnectionString="<%$ ConnectionStrings:oleConnectionString %>"

SelectCommand="SELECT DISTINCT * FROM [Likes] WHERE ([qid] = @qid) and ([sid] = @sid)">

<SelectParameters>

<asp:ControlParameter ControlID="Labelid" Name="qid" PropertyName="Text" Type="Int32" />

<asp:SessionParameter Name="sid" SessionField="studentid" Type="Int32" />

</SelectParameters>

</asp:SqlDataSource>

<asp:SqlDataSource ID="SqlDataSource4" runat="server" ConnectionString="<%$ ConnectionStrings:oleConnectionString %>"

SelectCommand="SELECT Heading, LikeCounter , CommentCounter , Qid , Uid FROM [NewsUploaded] WHERE ([qid] = @qid)">

<SelectParameters>

<asp:ControlParameter ControlID="Labelid" Name="qid" PropertyName="Text" Type="Int32" />

</SelectParameters>

</asp:SqlDataSource>

</div>

<div class="col-lg-12 paddingZero">

<table>

<tr>

<td width="10%">

<asp:DataList ID="DataList5" runat="server" DataSourceID="SqlDataSource2">

<ItemTemplate>

<asp:Image ID="loggerImage" class="imgpro" Style="margin-top: 5px; margin-left: -1px;"

ImageUrl='<%# "Handler2.ashx?sid=" + Eval("sid")%>' Width="50px" Height="50px"

runat="server" />

</ItemTemplate>

</asp:DataList>

<asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:oleConnectionString %>"

SelectCommand="SELECT sid FROM [Users] WHERE ([sid] = @sid)">

<SelectParameters>

<asp:SessionParameter Name="sid" SessionField="studentid" Type="Int32" />

</SelectParameters>

</asp:SqlDataSource>

</td>

<td width="70.5%">

<div style="padding-top: 5px;">

<asp:TextBox ID="TextBox2" TextMode="MultiLine" Height="36px" Style="border-left-color: White;

border-right-color: White; border-top-color: White; border-bottom-color: White;"

placeholder="leave a comment..." class="form-control" Width="100%" runat="server"

Wrap="True"></asp:TextBox>

</div>

</td>

<td>

<div>

<asp:Button ID="CommentButton" runat="server" Width="100%" Style="margin-top: 3px;"

class="btn btn-primary btn-md" CommandName="TakeIDForComment" Text="Comment" />

</div>

</td>

</tr>

</table>

</div>

<asp:DataList ID="DataList1" Width="100%" runat="server" OnItemCommand="DataList1_ItemCommand"

OnItemDataBound="DataList1_ItemDataBound">

<ItemTemplate>

<asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<div class="col-lg-12 paddingZero" style="padding-top: 5px; background-color: White;">

<div class="col-lg-2 paddingZero" style="width: 58px;">

<a href="<%# writeurl(Eval("sfname").ToString() ,Eval("slname").ToString() , Eval("sid").ToString()) %>"

>

<asp:Image ID="CommenterImage" class="imgpro" ImageUrl='<%# "Handler2.ashx?sid=" + Eval("sid")%>'

Width="50px" Height="50px" runat="server" />

</a>

</div>

<div class="col-lg-10 paddingZero forecolorofTitlesOfPost">

<strong><a href="<%# writeurl(Eval("sfname").ToString() ,Eval("slname").ToString() , Eval("sid").ToString()) %>"

class="forecolorofTitlesOfPost" style="text-decoration: none;">

<asp:Label ID="CommenterFirstNameLabel" runat="server" Text='<%# Eval("sfname") %>'></asp:Label>

<asp:Label ID="CommenterLastNameLabel" runat="server" Text='<%# Eval("slname") %>'></asp:Label>

</a>On

<asp:Label ID="Label13" Font-Size="15px" runat="server" Text='<%# Eval("commentdate" , "{0:D}") %>'></asp:Label>

</strong>

<br />

<asp:Label ID="comment" Font-Size="15px" class="wordbreak2" Style="color:black;"

runat="server" Text='<%# Eval("comment") %>'></asp:Label>

<asp:Button ID="Button1" runat="server" BorderStyle="None" Visible="false" Font-Size="10px"

CommandName="DeleteComment1" BackColor="Transparent" Text="Delete" />

<asp:Button ID="Button9" runat="server" BorderStyle="None" Visible="false" Font-Size="10px"

CommandName="DeleteComment2" BackColor="Transparent" Text="Delete" />

<asp:Button ID="Button10" runat="server" BorderStyle="None" Visible="false" Font-Size="10px"

CommandName="EditComment" BackColor="Transparent" Text="Edit" />

<asp:Button ID="Button3" runat="server" BorderStyle="None" Visible="true" Font-Size="10px"

CommandName="ReportForComment" BackColor="Transparent" Text="Report" />

<%--<asp:Button ID="Button11" runat="server" BorderStyle="None" Visible="true" Font-Size="10px" BackColor="Transparent" Text="Report" />--%>

<asp:Label ID="Label9" Font-Size="10px" class="forecolorofTitlesOfPost" runat="server"

Text='<%# Eval("EditStatus") %>'></asp:Label>

<asp:Label ID="Label17" Font-Size="10px" class="forecolorofTitlesOfPost" runat="server"

Text='<%# Eval("EditDate") %>'></asp:Label>

<asp:Label ID="CidLabel" runat="server" Visible="false" Text='<%# Eval("cid") %>'></asp:Label>

<asp:Label ID="QidLabel" runat="server" Visible="false" Text='<%# Eval("qid") %>'></asp:Label>

<asp:Label ID="SidLabel" runat="server" Visible="false" Text='<%# Eval("sid") %>'></asp:Label>

</div>

</div>

</ContentTemplate>

</asp:UpdatePanel>

</ItemTemplate>

</asp:DataList>

<center>

<h4 class="forecolorofTitlesOfPost">

-------------x-------------x-------------x-------------

</h4>

</center>

</div>

</ContentTemplate>

<Triggers>

</Triggers>

</asp:UpdatePanel>

</ItemTemplate>

</asp:DataList>

 

is it possible for my datalist code... please help...