Solved

change colour of repeater control in asp.net c#

Posted on 2016-09-30
7
111 Views
Last Modified: 2016-10-10
Hi experts,

I need blue colour in background of repeater control. I am using repeater cntrl like below. But unable to change the background colour.

Can you please suggest what is the best way to achieve that ?


 <asp:Repeater ID="rptPagerHeader" runat="server">
                                  <ItemTemplate>
                                        <asp:LinkButton ID="lnkPageHeader" runat="server" Text = '<%#Eval("Text") %>' CommandArgument = '<%# Eval("Value") %>' Enabled = '<%# Eval("Enabled") %>' OnClick = "Page_ChangedHeader"></asp:LinkButton>
                                    </ItemTemplate>                                                      
                   </asp:Repeater>
0
Comment
Question by:satmisha
  • 4
  • 2
7 Comments
 
LVL 40

Expert Comment

by:Kyle Abrahams
ID: 41823755
surround the repeater in a div and set the background of the div to blue.  then anything inside the div (eg: repeater and all controls) will also have a blue background unless there's a higher priority style rule.
0
 
LVL 21

Expert Comment

by:Tapan Pattanaik
ID: 41823827
HI satmisha,

Please check the sample below code. For change the background colour you have to add color in <td>

            <asp:Repeater ID="Repeater1" runat="server">
                <HeaderTemplate>
                    <table>
                        <tr>
                            <td style="background-color: Gray; width: 100px;">Id</td>
                            <td style="background-color: Gray; width: 100px;">Name</td>
                            <td style="background-color: Gray; width: 100px;">Age</td>
                            <td style="background-color: Gray; width: 100px;">Salary</td>
                            <td style="background-color: Gray; width: 100px;">Country</td>
                            <td style="background-color: Gray; width: 100px;">City</td>
                        </tr>
                    </table>
                </HeaderTemplate>
                <ItemTemplate>
                    <table>
                        <tr>
                            <td style="background-color: blue; width: 100px;">
                                <asp:Label ID="lblId" runat="server" Text='<%#Bind("id")%>'></asp:Label>
                            </td>
                            <td style="background-color: blue; width: 100px;">
                                <asp:Label ID="lblName" runat="server" Text='<%#Bind("name")%>'></asp:Label>
                            </td>
                            <td style="background-color: blue; width: 100px;">
                                <asp:Label ID="lblAge" runat="server" Text='<%#Bind("age")%>'></asp:Label>
                                <td style="background-color: blue; width: 100px;">
                                    <asp:Label ID="lblSalary" runat="server" Text='<%#Bind("salary")%>'></asp:Label>
                                </td>
                                <td style="background-color: blue; width: 100px;">
                                    <asp:Label ID="lblCountry" runat="server" Text='<%#Bind("country")%>'></asp:Label>
                                    <td style="background-color: blue; width: 100px;">
                                        <asp:Label ID="lblCity" runat="server" Text='<%#Bind("city")%>'></asp:Label>
                        </tr>
                    </table>
                </ItemTemplate>
            </asp:Repeater>

Open in new window


Regards,
Tapan Pattanaik
0
 

Author Comment

by:satmisha
ID: 41825897
Thanks Tapan,

TD colour suggestion worked but getting one small issue i.e. width of the td which is in repeater control is not same as that of grid columns as depicted in the attachment , could you please suggest that width of both of them should remain same
AlignmentIssue.docx
0
How Do You Stack Up Against Your Peers?

With today’s modern enterprise so dependent on digital infrastructures, the impact of major incidents has increased dramatically. Grab the report now to gain insight into how your organization ranks against your peers and learn best-in-class strategies to resolve incidents.

 

Author Comment

by:satmisha
ID: 41825902
Provided below is the code I have been using where getting issue of alignment:

 <Data:GridView ID="GridView1" runat="server" AllowSorting="True"
                AutoGenerateColumns="False" CellPadding="4" EnabledDuringCallBack="False" ForeColor="#333333"
                GridLines="None" PageSize="1" Font-Overline="False" Font-Size="X-Small"  AutoUpdateAfterCallBack="True" Width="98%"  CssClass="scroll-grid"
                UpdateAfterCallBack="True" PreCallBackFunction="disablegrid" PostCallBackFunction="enablegrid"  >
                <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
                <EmptyDataTemplate>
                    <anthem:Label ID="lblEmpty" runat="server" Text="No Locations found"></anthem:Label>
                </EmptyDataTemplate>
                <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" HorizontalAlign="Left" />
                <EditRowStyle BackColor="#2461BF" />
                <PagerStyle BackColor="#2461BF" ForeColor="White"  HorizontalAlign="Center" />
                <AlternatingRowStyle BackColor="White" />
                <Columns>
                    <asp:TemplateField ShowHeader="False">
                        <ItemTemplate>
                            <anthem:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Edit1" CommandArgument="<%#                         ((GridViewRow) Container).RowIndex %>"
                                PostCallBackFunction="hidewait" EnableCallBack="True" EnabledDuringCallBack="False">Edit</anthem:LinkButton>&nbsp;
                            <anthem:LinkButton ID="LinkButton2" runat="server" CausesValidation="False" CommandName="Remove"
                                PostCallBackFunction="
                                hidewait" EnableCallBack="False" EnabledDuringCallBack="False">Remove</anthem:LinkButton>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
                <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
                <PagerSettings Mode="NumericFirstLast" Position="TopAndBottom" />
                <RowStyle BackColor="#EFF3FB"  />
            </Data:GridView>
0
 

Author Comment

by:satmisha
ID: 41826139
Experts could you please suggest ?
0
 
LVL 40

Accepted Solution

by:
Kyle Abrahams earned 500 total points
ID: 41828910
make both 100%.
0
 

Author Closing Comment

by:satmisha
ID: 41837020
Awesome man. Thank you so much.
0

Featured Post

How Do You Stack Up Against Your Peers?

With today’s modern enterprise so dependent on digital infrastructures, the impact of major incidents has increased dramatically. Grab the report now to gain insight into how your organization ranks against your peers and learn best-in-class strategies to resolve incidents.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

ASP.Net to Oracle Connectivity Recently I had to develop an ASP.NET application connecting to an Oracle database.As I am doing it first time ,I had to solve several problems. This article will help to such developers  to develop an ASP.NET client…
User art_snob (http://www.experts-exchange.com/M_6114203.html) encountered strange behavior of Android Web browser on his Mobile Web site. It took a while to find the true cause. It happens so, that the Android Web browser (at least up to OS ver. 2.…
The goal of this video is to provide viewers with basic examples to understand how to use strings and some functions related to them in the C programming language.
Video by: Grant
The goal of this video is to provide viewers with basic examples to understand and use nested-loops in the C programming language.

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question