Solved

change colour of repeater control in asp.net c#

Posted on 2016-09-30
7
136 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
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

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 our DevOps Teams Maximize Uptime

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us. Read the use case whitepaper.

Question has a verified solution.

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

Suggested Solutions

Summary: This tutorial covers some basics of pointer, pointer arithmetic and function pointer. What is a pointer: A pointer is a variable which holds an address. This address might be address of another variable/address of devices/address of fu…
Real-time is more about the business, not the technology. In day-to-day life, to make real-time decisions like buying or investing, business needs the latest information(e.g. Gold Rate/Stock Rate). Unlike traditional days, you need not wait for a fe…
The goal of this video is to provide viewers with basic examples to understand opening and writing to files 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.

749 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