Gridview alphanumeric paging help

javivilchis · August 24th, 2009, 04:50 PM

Hello, I need help i'm creating an XML glossary but I cannot find a way to change numeric paging to alphanumeric then I will be needing to do some filtering, please help!!!

here is what I have so far.
glo.aspx.vb

Code:

Imports System.Data
Partial Class _Default
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Page.IsPostBack = False Then
            BindGrid()
        End If
    End Sub

    Sub BindGrid()
        Dim oDs As New DataSet
        oDs.ReadXml(Request.PhysicalApplicationPath + "glossary.xml")
        GridView1.DataSource = oDs
        GridView1.DataBind()
    End Sub

    Protected Sub GridView1_PageIndexChanging(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewPageEventArgs) Handles GridView1.PageIndexChanging
        GridView1.PageIndex = e.NewPageIndex
        BindGrid()
    End Sub


End Class

glo.aspx

Code:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="glo.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="GridView1" runat="server" AllowPaging="True" BackColor="White" BorderColor="#336666" BorderStyle="Double" BorderWidth="3px" CellPadding="4" GridLines="Horizontal" Width="600px" AutoGenerateColumns="False">
           
            <RowStyle BackColor="White" ForeColor="#333333" />
            <FooterStyle BackColor="White" ForeColor="#333333" />
            <PagerStyle BackColor="#336666" ForeColor="White" HorizontalAlign="Center" />
            <SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#336666" Font-Bold="True" ForeColor="White" />
            <Columns>
                <asp:BoundField AccessibleHeaderText="Word" DataField="word" HeaderText="Word">
                    <ControlStyle Font-Bold="True" Font-Size="Larger"/>
                </asp:BoundField>
                <asp:BoundField AccessibleHeaderText="Definition" DataField="definition" HeaderText="Definition" />
            </Columns>
        </asp:GridView>
        
       </div>
    </form>
</body>
</html>

Lee Dumond · August 24th, 2009, 06:38 PM

Here is some code you can use to add letters to the numbers that appear by default. Here, the letters should appear underneath the numbers.

In order to handle the paging for letters, you will also have to handle the RowCommand event. In the RowCommand event, you need to get the letter that was clicked, then provide code that selects a subset of your data based on words that begin with that letter, then databind it to the GridView.

Code:

 
Partial Class _Default
   Inherits Page
 
   Protected Sub GridView1_RowCreated (ByVal sender As Object, ByVal e As GridViewRowEventArgs) _
      Handles GridView1.RowCreated
 
      If e.Row.RowType = DataControlRowType.Pager Then
         Dim cell As TableCell = e.Row.Cells (0)
         cell.ColumnSpan = 2
 
         For index As Integer = 65 To 90
            Dim lb As LinkButton = New LinkButton
            lb.Text = Char.ConvertFromUtf32(index) & " "
            lb.CommandArgument = lb.Text
            lb.CommandName = "alphapage"
            cell.Controls.Add (lb)
         Next
      End If
   End Sub
 
   Protected Sub GridView1_RowCommand(ByVal sender As Object, ByVal e As GridViewCommandEventArgs) _
      Handles GridView1.RowCommand
 
      If e.CommandName = "alphapage" Then
         Dim firstLetter As String = e.CommandArgument
 
         ' here, insert code that will select a subset of your dataset 
         ' based on words beginning with firstLetter,
         ' then bind the data to the GridView
 
      End If
   End Sub
End Class

javivilchis · August 25th, 2009, 10:39 AM

Thank you lee for the help,
do I have to create another datasource or can I use the one in the first class?

Code:

Sub BindGrid()
        Dim oDs As New DataSet
        oDs.ReadXml(Request.PhysicalApplicationPath + "glossary.xml")
        GridView1.DataSource = oDs
        GridView1.DataBind()
    End Sub

if so, how would I structure it? inside this class:

Code:

Protected Sub GridView1_RowCommand(ByVal sender As Object, ByVal e As GridViewCommandEventArgs) _
       Handles GridView1.RowCommand

        If e.CommandName = "alphapage" Then
            Dim firstLetter As String = e.CommandArgument

            ' here, insert code that will select a subset of your dataset 
            ' based on words beginning with firstLetter,
            ' then bind the data to the GridView

        End If
    End Sub

I want to get the letter of the "id" node from withing the xml file the node includes the letter of the alphabet but I don't want to show the letter. or it could sort by first letter of the "word" node. please help!

Lee Dumond · August 25th, 2009, 12:06 PM

Yes, you need to create a dataset that filters out the words based on their first letter. Without seeing the schema of your XML file there's not much more I can tell you.

javivilchis · August 25th, 2009, 12:18 PM

Lee,

thank you I will create the dataset with the filter and let you know how that goes.

jav

javivilchis · August 25th, 2009, 03:03 PM

o.k.

i've been searching for a way to filter the nodes and I can't find an answer everything references back to calling SQL queries. Can you point me to a website that describes how to filter xml files into the gridview? or is there anyone that can help filter this pager.

thank you in advanced,

jav

javivilchis · August 25th, 2009, 03:05 PM

the xml file looks like this:
<glossary>
<term>
<id>A</id>
<word>Anything</word>
<definition>all about anything</definition>
</term>
</glossary>

Lee Dumond · August 25th, 2009, 04:15 PM

I am not that great with DataSets (or with VB for that matter), but this should do it:

Code:

Protected Sub GridView1_RowCommand(ByVal sender As Object, ByVal e As GridViewCommandEventArgs) _
   Handles GridView1.RowCommand
 
   If e.CommandName = "alphapage" Then
      Dim firstLetter As String = e.CommandArgument.ToString.Trim
 
      Dim oDs As New DataSet
      oDs.ReadXml(Request.PhysicalApplicationPath & "glossary.xml")
 
      Dim filteredView As DataView = New DataView(oDs.Tables(0))
      filteredView.RowFilter = "word LIKE '" & firstLetter & "%'"
 
      GridView1.DataSource = filteredView
      GridView1.DataBind()
 
   End If
End Sub

javivilchis · August 25th, 2009, 04:43 PM

Lee,

There is only one problem with it. When I click on the letter it shows the letter with records but the paging dis appears. I have to click the back button to see the paging again.

Lee Dumond · August 25th, 2009, 05:04 PM

The Paging does not show if the number of records is less than the PageSize of the GridView, which is by default = 10 records.

In this case, you should add the letter paging to a customized footer.