Reputation: 1155
I am currently trying to change the back color of the rows in my listview. From what I have researched I can use this code to change the row color:
foreach(ListViewItem lvi in LV_Equipment)
{
lvi.BackColor = Color.Red;
}
When I try to use this code my ListViewItem(lvi) does not have a BackColor property. I am not too sure why this would be, form what I have seen online this is the way to go about this. I have 5 ListViews on my page and all 5 cannot find this property.
Here is my ListView configuration:
<asp:ListView ID="LV_Equipment" runat="server" DataSourceID="SQL_Equipment" InsertItemPosition="LastItem" DataKeyNames="JobUnitKey" OnPreRender="LV_Equipment_PreRender" OnSelectedIndexChanged="LV_Equipment_SelectedIndexChanged" OnItemCanceling="LV_Equipment_ItemCanceling" OnItemDataBound="LV_Equipment_ItemDataBound" OnItemInserting="LV_Equipment_ItemInserting" OnDataBound="LV_Equipment_DataBound" >
<AlternatingItemTemplate>
<tr style="background-color:#FFF8DC;">
<td>
<asp:Button ID="SelectButton" runat="server" CommandName="Select" Text="Delete" />
<asp:Button ID="EditButton" runat="server" CommandName="Edit" Text="Edit" />
</td>
<!--<asp:Label ID="JobUnitKeyLabel" runat="server" Text='<%# Eval("JobUnitKey") %>' />-->
<td>
<asp:Label ID="JobIDLabel" runat="server" Text='<%# Eval("JobID") %>' />
</td>
<td>
<asp:Label ID="DispatchDateLabel" runat="server" Text='<%# Eval("DispatchDate", "{0:MMM dd yyyy}") %>' />
</td>
<td>
<asp:Label ID="TimeToArriveLabel" runat="server" Text='<%# Eval("TimeToArrive", "{0:HH:mm}") %>' />
</td>
<td>
<asp:Label ID="UnitIDLabel" runat="server" Text='<%# Eval("UnitID") %>' />
</td>
<td>
<asp:Label ID="DriverNameLabel" runat="server" Text='<%# Eval("DriverName") %>' />
</td>
<td>
<asp:Label ID="TruckRateLabel" runat="server" Text='<%# Eval("TruckRate", "{0:$0.00}") %>' />
</td>
<td>
<asp:Label ID="NotesLabel" runat="server" Text='<%# Eval("Notes") %>' />
</td>
</tr>
</AlternatingItemTemplate>
<EditItemTemplate>
<tr style="background-color:#008A8C;color: #FFFFFF;">
<td>
<asp:Button ID="UpdateButton" runat="server" CommandName="Cancel" Text="Update" />
<asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Cancel" />
</td>
<!--<asp:Label ID="JobUnitKeyLabel" runat="server" Text='<%# Eval("JobUnitKey") %>' />-->
<td>
<asp:Label ID="LBL_Insert_Equipment_JobID" runat="server" Text='<%# Bind("JobID") %>'></asp:Label>
</td>
<td>
<asp:TextBox ID="DispatchDateTextBox" runat="server" Text='<%# Bind("DispatchDate", "{0:MM-dd-yyyy}") %>' />
</td>
<td>
<asp:TextBox ID="TimeToArriveTextBox" runat="server" Text='<%# Bind("TimeToArrive", "{0:HH:mm}") %>' />
</td>
<td>
<asp:DropDownList ID="DropDownList1" runat="server" DataSourceID="SQL_GetUnits" DataTextField="UnitID" DataValueField="UnitID" SelectedValue='<%# Bind("UnitID") %>'>
</asp:DropDownList>
<asp:Button ID="BTN_Equipment_Insert_Add_Unit" runat="server" OnClick="BTN_Equipment_Insert_Add_Unit_Click" Text="Add Unit" />
</td>
<td>
<asp:DropDownList ID="DDL_Insert_Drivers" runat="server" DataSourceID="SQL_GetDrivers" DataTextField="DriverName" DataValueField="DriverID" >
</asp:DropDownList>
<asp:Button ID="BTN_Equipment_Insert_Add_Driver" runat="server" OnClick="BTN_Equipment_Insert_Add_Driver_Click" Text="Add Driver" />
</td>
<td>
<asp:TextBox ID="TruckRateTextBox" runat="server" Text='<%# Bind("TruckRate") %>' />
</td>
<td>
<asp:TextBox ID="NotesTextBox" runat="server" Text='<%# Bind("Notes") %>' />
</td>
</tr>
</EditItemTemplate>
<EmptyDataTemplate>
<table runat="server" style="background-color: #FFFFFF;border-collapse: collapse;border-color: #999999;border-style:none;border-width:1px;">
<tr>
<td>No data was returned.</td>
</tr>
</table>
</EmptyDataTemplate>
<InsertItemTemplate>
<tr style="">
<td>
<asp:Button ID="InsertButton" runat="server" CommandName="Insert" Text="Insert" />
<asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Clear" />
</td>
<td>
<asp:Label ID="LBL_Insert_Equipment_JobID" runat="server" Text='<%# Bind("JobID") %>'></asp:Label>
</td>
<td>
<asp:TextBox ID="DispatchDateTextBox" runat="server" PlaceHolder="MM-dd-yyyy" Text='<%# Bind("DispatchDate") %>' />
</td>
<td>
<asp:TextBox ID="TimeToArriveTextBox" runat="server" PlaceHolder="HH:mm" Text='<%# Bind("TimeToArrive") %>' />
</td>
<td>
<asp:DropDownList ID="DropDownList1" runat="server" DataSourceID="SQL_GetUnits" DataTextField="UnitID" DataValueField="UnitID" SelectedValue='<%# Bind("UnitID") %>'>
</asp:DropDownList>
<asp:Button ID="BTN_Equipment_Insert_Add_Unit" runat="server" OnClick="BTN_Equipment_Insert_Add_Unit_Click" Text="Add Unit" />
</td>
<td>
<asp:DropDownList ID="DDL_Insert_Drivers" runat="server" DataSourceID="SQL_GetDrivers" DataTextField="DriverName" DataValueField="DriverID" SelectedValue='<%# Bind("DriverID") %>'>
</asp:DropDownList>
<asp:Button ID="BTN_Equipment_Insert_Add_Driver" runat="server" OnClick="BTN_Equipment_Insert_Add_Driver_Click" Text="Add Driver" />
</td>
<td>
<asp:TextBox ID="TruckRateTextBox" runat="server" Text='<%# Bind("TruckRate") %>' />
</td>
<td>
<asp:TextBox ID="NotesTextBox" runat="server" Text='<%# Bind("Notes") %>' />
</td>
</tr>
</InsertItemTemplate>
<ItemTemplate>
<tr style="background-color:#DCDCDC;color: #000000;">
<td>
<asp:Button ID="SelectButton" runat="server" CommandName="Select" Text="Delete" />
<asp:Button ID="EditButton" runat="server" CommandName="Edit" Text="Edit" />
</td>
<!--<asp:Label ID="JobUnitKeyLabel" runat="server" Text='<%# Eval("JobUnitKey") %>' />-->
<td>
<asp:Label ID="JobIDLabel" runat="server" Text='<%# Eval("JobID") %>' />
</td>
<td>
<asp:Label ID="DispatchDateLabel" runat="server" Text='<%# Eval("DispatchDate", "{0:MMM dd yyyy}") %>' />
</td>
<td>
<asp:Label ID="TimeToArriveLabel" runat="server" Text='<%# Eval("TimeToArrive", "{0:HH:mm}") %>' />
</td>
<td>
<asp:Label ID="UnitIDLabel" runat="server" Text='<%# Eval("UnitID") %>' />
</td>
<td>
<asp:Label ID="DriverNameLabel" runat="server" Text='<%# Eval("DriverName") %>' />
</td>
<td>
<asp:Label ID="TruckRateLabel" runat="server" Text='<%# Eval("TruckRate", "{0:$0.00}") %>' />
</td>
<td>
<asp:Label ID="NotesLabel" runat="server" Text='<%# Eval("Notes") %>' />
</td>
</tr>
</ItemTemplate>
<LayoutTemplate>
<table runat="server">
<tr runat="server">
<td runat="server">
<table id="itemPlaceholderContainer" runat="server" border="1" style="background-color: #FFFFFF;border-collapse: collapse;border-color: #999999;border-style:none;border-width:1px;font-family: Verdana, Arial, Helvetica, sans-serif;">
<tr runat="server" style="background-color:#DCDCDC;color: #000000;">
<th runat="server"></th>
<th runat="server" id="JobUnitKeyRow">JobUnitKey</th>
<th runat="server">JobID</th>
<th runat="server">DispatchDate</th>
<th runat="server">TimeToArrive</th>
<th runat="server">UnitID</th>
<th runat="server">DriverName</th>
<th runat="server">TruckRate</th>
<th runat="server">Notes</th>
</tr>
<tr id="itemPlaceholder" runat="server">
</tr>
</table>
</td>
</tr>
<tr runat="server">
<td runat="server" style="text-align: center;background-color: #CCCCCC;font-family: Verdana, Arial, Helvetica, sans-serif;color: #000000;">
<asp:DataPager ID="DataPager1" runat="server">
<Fields>
<asp:NextPreviousPagerField ButtonType="Button" ShowFirstPageButton="True" ShowNextPageButton="False" ShowPreviousPageButton="False" />
<asp:NumericPagerField />
<asp:NextPreviousPagerField ButtonType="Button" ShowLastPageButton="True" ShowNextPageButton="False" ShowPreviousPageButton="False" />
</Fields>
</asp:DataPager>
</td>
</tr>
</table>
</LayoutTemplate>
<SelectedItemTemplate>
<tr style="background-color:#008A8C;font-weight: bold;color: #FFFFFF;">
<td>
<asp:Button ID="DeleteButton" runat="server" CommandName="Delete" Text="Delete" />
<asp:Button ID="EditButton" runat="server" CommandName="Edit" Text="Edit" />
</td>
<td>
<asp:Label ID="JobUnitKeyLabel" runat="server" Text='<%# Eval("JobUnitKey") %>' />
</td>
<td>
<asp:Label ID="JobIDLabel" runat="server" Text='<%# Eval("JobID") %>' />
</td>
<td>
<asp:Label ID="DispatchDateLabel" runat="server" Text='<%# Eval("DispatchDate") %>' />
</td>
<td>
<asp:Label ID="TimeToArriveLabel" runat="server" Text='<%# Eval("TimeToArrive") %>' />
</td>
<td>
<asp:Label ID="UnitIDLabel" runat="server" Text='<%# Eval("UnitID") %>' />
</td>
<td>
<asp:Label ID="DriverNameLabel" runat="server" Text='<%# Eval("DriverName") %>' />
</td>
<td>
<asp:Label ID="TruckRateLabel" runat="server" Text='<%# Eval("TruckRate") %>' />
</td>
<td>
<asp:Label ID="NotesLabel" runat="server" Text='<%# Eval("Notes") %>' />
</td>
</tr>
</SelectedItemTemplate>
</asp:ListView>
Upvotes: 0
Views: 718
Reputation: 601
This is what CSS is for. It looks like your ItemTemplate has a background-color of #dcdcdc (light-grey). You can change your inline style to be the appropriate shade of red or (better) you can assign the template a css class and assign a background to that css class (e.g. – .bg-red { background:red;}).
Response to the need to change background colors conditionally. I would user javascript or jQuery if at all possible. In Web Forms this prevents postbacks/round trips the server if the values that will impact the background color changes from user input. A simple block of jQuery:
$('.itemClass').each(function (item) {
if (item.value == someVal) {
item.addClass('bg-red');
}
});
Upvotes: 1
Reputation: 139
You could add the paremeter CssClass to your ListBox:
<asp:ListBox ID="ListBox1" runat="server" CssClass="ListBoxnewStyle"></asp:ListBox>
And in your CSS file:
1.- Add the reference to your HTML webpage in header tag
<link href="StyleSheet1.css" rel="stylesheet" />
2.- The CSS file must contain something like this:
.ListBoxnewStyle
{
background-color:red;
}
Hope this help.
Upvotes: 1
Reputation: 239
Try removing the background-color values from your tr tags in the item templates.
Upvotes: 1