Changing Color of LinkButton in Repeater

Question

I am creating a custom pagination for my GridView, so far I've done everything except this thing: I want to highlight the selected page in different color or different font style or anything I want to. For example if I have pages 1 2 3 4 5 6 and I do select 4, when it reloads the data from GridView I want 4 to be colored in Red 1 2 3 4 5 6. This is my aspx file

<asp:Repeater ID="repeaterPaging" runat="server" >
<ItemTemplate>
   <asp:LinkButton ID="pagingLinkButton" runat="server"
        Text='<%#Eval("Text") +" | " %>' 
        CommandArgument='<%# Eval("Value") %>'
        Enabled='<%# Eval("Enabled")%>' 
        OnClick="linkButton_Click" ForeColor="White" Font-Bold="True" Font-Underline="false">
    </asp:LinkButton>
</ItemTemplate>

If u can give me any info about how can I put " | " away, so only the numbers be like LinkButtons, since now my LinkButton is NUMBER+" | "

My LinkButtonClick method

        protected void linkButton_Click(object sender, EventArgs e)
    {
        //int totalRows = 0;
        LinkButton lb = (LinkButton)sender;
        lb.Attributes.Add("class", "BlackLnkBtn");
        int pageIndex = int.Parse((sender as LinkButton).CommandArgument);
        pageIndex -= 1;
        gridViewSearchReport.PageIndex = pageIndex;
        //gridViewSearchReport.DataSource = EmployeeDataAccessLayer.
        //    GetEmployees(pageIndex, GridView1.PageSize, out totalRows);
       // FetchData(pageIndex);

        gridViewSearchReport.DataSource = FetchData(pageIndex+1);
        gridViewSearchReport.DataBind();
        DatabindRepeater(pageIndex, gridViewSearchReport.PageSize, RowNumber());
        CheckButtonsAvailability(pageIndex + 1);

    }

and im filling the page like this

pages.Add(new ListItem(i.ToString(),i.ToString(), i != (pageIndex + 1)));

Basicly I want to indicate which is the current page I am viewing atm.

Thanks in advance.

Answer 1

I solved it in a different way, using javascript : I added this function so a hidden label can take the value of the selected index, and then the selected index take the style of this label.

        $().ready(function () {
        $('#ctl00_ContentPlaceHolder1_lbPageView(THIS IS DIV ID OF THE ROW WHERE PAGINATION IS GENERATING>a').each(function () {
            if ($(this).text() == $('.lblPageNum').text())  
            {
                $(this).css('color', '#FDBE0E');
            }
        });
    });

label:

 <asp:Label ID="lblPageNum" style="display:none;" Class="lblPageNum" runat="server" />

and then simply change it in code-behind in the btnclick event

lblPageNum.Text = (pageIndex += 1).ToString();

Answer 2

Set the ForeColor property of the LinkButton in the click handler, like this:

protected void linkButton_Click(object sender, EventArgs e)
{
    //int totalRows = 0;
    LinkButton lb = (LinkButton)sender;
    lb.Attributes.Add("class", "BlackLnkBtn");
    int pageIndex = int.Parse((sender as LinkButton).CommandArgument);
    pageIndex -= 1;
    gridViewSearchReport.PageIndex = pageIndex;
    //gridViewSearchReport.DataSource = EmployeeDataAccessLayer.
    //    GetEmployees(pageIndex, GridView1.PageSize, out totalRows);
   // FetchData(pageIndex);

    gridViewSearchReport.DataSource = FetchData(pageIndex+1);
    gridViewSearchReport.DataBind();
    DatabindRepeater(pageIndex, gridViewSearchReport.PageSize, RowNumber());
    CheckButtonsAvailability(pageIndex + 1);

    // Make the clicked link button red
    lb.ForeColor = System.Drawing.Color.Red;
}