[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 228
  • Last Modified:

How can I change the backcolor of cells of the row selected of a listview?

Is it possible to change the row cells backcolor for asp.net web app not windows based?
0
zachvaldez
Asked:
zachvaldez
  • 5
  • 4
  • 2
2 Solutions
 
Paul MacDonaldDirector, Information SystemsCommented:
0
 
Paul MacDonaldDirector, Information SystemsCommented:
Sorry, hit enter too soon.  

There's a javascript solution on that page.  If that doesn't suit you for some reason, the gridview control has a native way of changing the selected row color.
0
 
tlaytonCommented:
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
zachvaldezAuthor Commented:
Im gertting server tag not well formed using this from the former link..

<tr id="Tr2" runat="server"  style="background-color:<%#(Container.DisplayIndex == ListView1.SelectedIndex) ? "blue" : "#FFFBD6" %>;color: #333333;">
0
 
tlaytonCommented:
You need to change the <% %> to what you want, like this:
<tr id="Tr2" runat="server" style="background-color:#FFFBD6;color: #333333;">

Open in new window

0
 
zachvaldezAuthor Commented:
This is exactly what I have..
<td>
                        <asp:LinkButton ID="EditButton" runat="Server" Text='<%# Eval("keyID") %>'  
                            CommandName="Edit" />
 
                    </td>
but is not working meaning  changing the backcolor.
0
 
tlaytonCommented:
Hi, if you could post me your entire working listview from <asp:Listview> to </asp:Listview> then I can insert a SelectedItemTemplate for you to get you going...
0
 
zachvaldezAuthor Commented:
thanks, check it out

      <asp:ListView ID="ListView1" runat="server"  DataKeyNames="pkeyID"
            style="margin-left: 0px">
            <LayoutTemplate>
                <table cellpadding="1" border="1" runat="server" id="tblNames">
                    <tr id="Tr1" runat="server">
                                          <th id="Th2" runat="server">
                            Last Name
                        </th>
                        <th id="Th3" runat="server">
                            First Name
                        </th>
                        <th id="Th4" runat="server">
                            1st Choice A
                        </th>
                        <th id="Th5" runat="server">
                            1st Choice B
                        </th>
                        <th id="Th6" runat="server">
                            1st Choice C
                        </th>
 
                        <th id="Th1" runat="server" style="background-color: #FFFFCC">
                        </th>
                        <th id="Th14" runat="server" style="background-color: #FFFFCC">
                        </th>
                          <th id="Th15" runat="server" style="background-color: #FFFFCC">
                        </th>
                    </tr>
                    <tr runat="server" id="itemPlaceholder" />
                </table>
 
            </LayoutTemplate>
            <ItemTemplate>
                <tr id="Tr2" runat="server" style="background-color:#FFFBD6;color: #333333;">
               

                    <td>
                        <asp:Label ID="LastNameLabel" runat="Server" CssClass="cap" Text='<%#Eval("LastName") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="FirstNameLabel" runat="Server" CssClass="cap" Text='<%#Eval("FirstName") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceA" runat="Server" Text='<%#Eval("FirstChoiceA") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceB" runat="Server" Text='<%#Eval("FirstChoiceB") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceC" runat="Server" Text='<%#Eval("FirstChoiceC") %>' />
                    </td>
 
           
                   
                    <td>
                     <asp:LinkButton ID="EditButton" runat="Server" Text="Edit" OnClientClick="scrollToPosition()"  CommandName="Edit" CausesValidation="false"/>
                       
                    </td>
                    <td>
                        <asp:LinkButton ID="LinkButton2" runat="Server" Text="Update" OnClientClick="window.scrollBy(0, document.body.scrollHeight)" CommandName="Update" CausesValidation="false" />
                    </td>
                    <td>
                        <asp:LinkButton ID="LinkButton1" runat="Server"  OnClientClick="return confirm('OK to Delete?')" Text="Delete" CommandName="Delete" CausesValidation="false"/>
                    </td>
                </tr>
            </ItemTemplate>
        </asp:ListView>
    </form>

can u suggest also how to make it nicer?
0
 
tlaytonCommented:
Give this a try:

As far as making it look nicer I'm afraid I am a pure developer and know very little about design, I would only make it look worse!

 
<asp:ListView ID="ListView1" runat="server"  DataKeyNames="pkeyID"
            style="margin-left: 0px">
            <LayoutTemplate>
                <table cellpadding="1" border="1" runat="server" id="tblNames">
                    <tr id="Tr1" runat="server">
                                          <th id="Th2" runat="server">
                            Last Name
                        </th>
                        <th id="Th3" runat="server">
                            First Name
                        </th>
                        <th id="Th4" runat="server">
                            1st Choice A
                        </th>
                        <th id="Th5" runat="server">
                            1st Choice B
                        </th>
                        <th id="Th6" runat="server">
                            1st Choice C
                        </th>
 
                        <th id="Th1" runat="server" style="background-color: #FFFFCC">
                        </th>
                        <th id="Th14" runat="server" style="background-color: #FFFFCC">
                        </th>
                          <th id="Th15" runat="server" style="background-color: #FFFFCC">
                        </th>
                    </tr>
                    <tr runat="server" id="itemPlaceholder" />
                </table>
            </LayoutTemplate>
            <ItemTemplate>
                <tr id="Tr2" runat="server" style="background-color:#FFFBD6;color: #333333;">
                    <td>
                        <asp:Label ID="LastNameLabel" runat="Server" CssClass="cap" Text='<%#Eval("LastName") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="FirstNameLabel" runat="Server" CssClass="cap" Text='<%#Eval("FirstName") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceA" runat="Server" Text='<%#Eval("FirstChoiceA") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceB" runat="Server" Text='<%#Eval("FirstChoiceB") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceC" runat="Server" Text='<%#Eval("FirstChoiceC") %>' />
                    </td>
                    <td>
                     <asp:LinkButton ID="EditButton" runat="Server" Text="Edit" OnClientClick="scrollToPosition()"  CommandName="Edit" CausesValidation="false"/>
                       
                    </td>
                    <td>
                        <asp:LinkButton ID="LinkButton2" runat="Server" Text="Update" OnClientClick="window.scrollBy(0, document.body.scrollHeight)" CommandName="Update" CausesValidation="false" />
                    </td>
                    <td>
                        <asp:LinkButton ID="LinkButton1" runat="Server"  OnClientClick="return confirm('OK to Delete?')" Text="Delete" CommandName="Delete" CausesValidation="false"/>
                    </td>
                </tr>
            </ItemTemplate>
            <SelectedItemTemplate>  
                <tr id="Tr2" runat="server" style="background-color:#0000FF;color: #FFFFFF;">
                    <td>
                        <asp:Label ID="LastNameLabel" runat="Server" CssClass="cap" Text='<%#Eval("LastName") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="FirstNameLabel" runat="Server" CssClass="cap" Text='<%#Eval("FirstName") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceA" runat="Server" Text='<%#Eval("FirstChoiceA") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceB" runat="Server" Text='<%#Eval("FirstChoiceB") %>' />
                    </td>
                    <td valign="top">
                        <asp:Label ID="lblfirstchoiceC" runat="Server" Text='<%#Eval("FirstChoiceC") %>' />
                    </td>
                    <td>
                     <asp:LinkButton ID="EditButton" runat="Server" Text="Edit" OnClientClick="scrollToPosition()"  CommandName="Edit" CausesValidation="false"/>
                    </td>
                    <td>
                        <asp:LinkButton ID="LinkButton2" runat="Server" Text="Update" OnClientClick="window.scrollBy(0, document.body.scrollHeight)" CommandName="Update" CausesValidation="false" />
                    </td>
                    <td>
                        <asp:LinkButton ID="LinkButton1" runat="Server"  OnClientClick="return confirm('OK to Delete?')" Text="Delete" CommandName="Delete" CausesValidation="false"/>
                    </td>
                </tr>                
            </SelectedItemTemplate>  
        </asp:ListView>
    </form>

Open in new window

0
 
tlaytonCommented:
Btw for changing the colour in the above code, use the following line (within the SelectedItemTemplate):

<tr id="Tr2" runat="server" style="background-color:#0000FF;color: #FFFFFF;">
0
 
zachvaldezAuthor Commented:
nothing change, the row color did not change.
0

Featured Post

Vote for the Most Valuable Expert

It’s time to recognize experts that go above and beyond with helpful solutions and engagement on site. Choose from the top experts in the Hall of Fame or on the right rail of your favorite topic page. Look for the blue “Nominate” button on their profile to vote.

  • 5
  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now