I have a basic gridview with paging enabled. I have 11 rows in my database and the gridview’s page size is 10. When I come to the page, it shows 10 rows, and in my pager, it shows me on page one with a link to a second page. When I click on the second page, it refreshes the page and goes to page 2 and displays the 11th, lonely row.
When I put an update panel around it, however, it drops the last row. When I come to the page, it shows the same as without the update panel. It shows 10 rows with page 1 and 2 on the pager. When I click on page 2, however, it does it’s ajax thing, but doesn’t display the last record on the 2nd page. Then, if I go from page 2 back to page 1, it only displays 9 rows instead of the 10 it used to display.
For some reason, when I have an update panel around my gridview, after you page once, it never displays the last row. I have tried all the different combinations of RenderMode, ChildrenAsTriggers and UpdateMode to no avail. I also have a form on the page that allows you to add new rows to the database, and consequently the gridview as well as an edit and delete link inside the gridview, all within the update panel. When I add a new row via the form or edit/delete, this doesn’t happen…it only happens when I page.
Any ideas why the gridview won’t display the last record/row after I page only when it’s inside an update panel?
Here is the code…
ASPX
<asp:UpdatePanel runat="server" ID="uPnl" ChildrenAsTriggers="true" RenderMode="Block" UpdateMode="Always">
<ContentTemplate>
<asp:Panel runat="server" ID="pnlAddComment" CssClass="addComment" DefaultButton="btnSubmitComment">
<h1 class="postComment">Post Comment</h1>
<asp:TextBox runat="server" ID="txtName" CssClass="txtName"></asp:TextBox>
<ajaxToolkit:TextBoxWatermarkExtender ID="txtNameW" runat="server"
TargetControlID="txtName"
WatermarkText="- Type your name here -"
WatermarkCssClass="txtNameWatermark" />
<asp:RequiredFieldValidator runat="server" ID="reqName" ControlToValidate="txtName" Display="Dynamic" ErrorMessage="Please enter your name" ValidationGroup="comment"></asp:RequiredFieldValidator>
<asp:TextBox runat="server" ID="txtComment" TextMode="MultiLine" CssClass="txtComment"></asp:TextBox>
<ajaxToolkit:TextBoxWatermarkExtender ID="TBWE2" runat="server"
TargetControlID="txtComment"
WatermarkText="- Write anything you'd like about this event -"
WatermarkCssClass="txtCommentWatermark" />
<asp:RequiredFieldValidator runat="server" ID="reqComment" ControlToValidate="txtComment" Display="Dynamic" ErrorMessage="Please enter your comment" ValidationGroup="comment"></asp:RequiredFieldValidator>
<div class="buttons">
<asp:Button runat="server" ID="btnSubmitComment" ValidationGroup="comment" Text="Submit Comment" />
<span class="loader">Saving</span>
</asp:Panel>
<h1>Recent Comments</h1>
<a name="comments"> </a>
<asp:GridView runat="server" ID="gvComments" DataKeyNames="CommentID" PagerSettings-Position="TopAndBottom" AllowPaging="true" PageSize="10" AutoGenerateColumns="false" GridLines="None" CssClass="comments">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<div class="comment user">
<p>
<img src="images/icon.gif" width="46" height="55" />
<%#Eval("UserComment")%>
<span>
Posted by <%#Eval("UserName")%> <br/>
on <%#Format(Eval("DateCreated"), "MM/dd/yyyy")%> at <%#Format(Eval("DateCreated"), "h:mm tt")%>
</span>
<asp:LinkButton runat="server" CausesValidation="false" ID="lnkEdit" CssClass="edit" CommandName="Edit" Text="Edit"></asp:LinkButton>
<asp:LinkButton runat="server" ID="lnkDelete" CommandArgument='<%#Eval("CommentID")%>' CssClass="delete" OnClientClick="return confirm('Are you sure you want to delete this comment?');" CausesValidation="false" OnClick="DeleteComment" Text="Delete"></asp:LinkButton>
</p>
</div>
</ItemTemplate>
<EditItemTemplate>
<div class="comment user">
<p>
<img src="images/icon.gif" width="46" height="55" />
<label>Name:</label>
<asp:TextBox runat="server" ID="txtNameEdit" Width="240" Text='<%#Eval("UserName")%>'></asp:TextBox><br />
<label>Comment:</label>
<asp:TextBox runat="server" TextMode="MultiLine" ID="txtCommentEdit" Width="240" Height="100" Text='<%#Eval("UserComment") %>'></asp:TextBox>
<asp:LinkButton runat="server" ID="lnkCancel" CommandName="Cancel" CssClass="cancel" CausesValidation="false" Text="Cancel"></asp:LinkButton>
<asp:LinkButton runat="server" ID="lnkUpdate" CommandName="Update" CssClass="update" CausesValidation="false" Text="Update"></asp:LinkButton>
</p>
</div>
</EditItemTemplate>
</asp:TemplateField>
</Columns>
<PagerStyle CssClass="grdFooter" HorizontalAlign="right" />
<PagerSettings PageButtonCount="7" />
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
VB Code Behind
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack Then
bindComments()
End If
End Sub
Private Sub bindComments()
gvComments.DataSource = dataaccess.getdataset("SELECT * FROM Comments ORDER BY DateCreated DESC", Data.CommandType.Text)
gvComments.DataBind()
End Sub
Protected Sub gvComments_RowEditing(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewEditEventArgs) Handles gvComments.RowEditing
gvComments.EditIndex = e.NewEditIndex
bindComments()
End Sub
Protected Sub gvComments_RowCancelingEdit(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCancelEditEventArgs) Handles gvComments.RowCancelingEdit
gvComments.EditIndex = -1
bindComments()
End Sub
Protected Sub gvComments_PageIndexChanging(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewPageEventArgs) Handles gvComments.PageIndexChanging
gvComments.PageIndex = e.NewPageIndex
bindComments()
End Sub
Protected Sub btnSubmitComment_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnSubmitComment.Click
Dim userType As String = "attendee"
If Not IsNothing(Request.QueryString("user")) AndAlso Request.QueryString("user").Length > 0 Then
userType = Request.QueryString("user")
End If
dataaccess.NoReturnQuery("INSERT INTO Comments (UserName, UserComment, UserType) VALUES ('" & txtName.Text.Replace("'", "''") & "','" & txtComment.Text.Replace("'", "''").Replace(vbCrLf, "<br />") & "','" & userType & "')", Data.CommandType.Text)
txtComment.Text = ""
txtName.Text = ""
gvComments.PageIndex = 0
bindComments()
End Sub
Sub DeleteComment(ByVal sender As Object, ByVal e As System.EventArgs)
Dim lnk As LinkButton = TryCast(sender, LinkButton)
If Not IsNothing(lnk) AndAlso IsNumeric(lnk.CommandArgument) Then
dataaccess.NoReturnQuery("DELETE FROM Comments WHERE CommentID = " & lnk.CommandArgument, Data.CommandType.Text)
bindComments()
End If
End Sub
Protected Sub gvComments_RowUpdating(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewUpdateEventArgs) Handles gvComments.RowUpdating
Dim row As GridViewRow = gvComments.Rows(e.RowIndex)
Dim txtCommentEdit As TextBox = CType(row.FindControl("txtCommentEdit"), TextBox)
Dim txtNameEdit As TextBox = CType(row.FindControl("txtNameEdit"), TextBox)
dataaccess.NoReturnQuery("UPDATE Comments SET UserComment = '" & txtCommentEdit.Text.Replace("'", "''").Replace(vbCrLf, "<br />") & "', UserName = '" & txtNameEdit.Text.Replace("'", "''") & "' WHERE CommentID = " & gvComments.DataKeys(e.RowIndex).Value, Data.CommandType.Text)
gvComments.EditIndex = -1
bindComments()
End Sub
Protected Sub gvComments_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gvComments.RowDataBound
Dim lnkDelete As LinkButton = CType(e.Row.FindControl("lnkDelete"), LinkButton)
If Not IsNothing(lnkDelete) Then
If Request.QueryString("user") = "admin" Then
lnkDelete.Visible = True
Else
lnkDelete.Visible = False
End If
End If
Dim lnkEdit As LinkButton = CType(e.Row.FindControl("lnkEdit"), LinkButton)
If Not IsNothing(lnkEdit) Then
If Request.QueryString("user") = "admin" Then
lnkEdit.Visible = True
Else
lnkEdit.Visible = False
End If
End If
End Sub
Try this from the code-behind on Page_Load: