How can I repaire background color in RadListviewFloated ?
I change color back ground in rlvI and rlvA, it's same but I use change class="rlvI <%# Eval("ID") %>" with class rlvI"ID"
it's running only half of it?
I try to get ID by ListView_ItemDataBound but it's only change half of it too?
I change color back ground in rlvI and rlvA, it's same but I use change class="rlvI <%# Eval("ID") %>" with class rlvI"ID"
it's running only half of it?
I try to get ID by ListView_ItemDataBound but it's only change half of it too?
4 Answers, 1 is accepted
0
Shinu
Top achievements
Rank 2
Rank 2
answered on 05 Feb 2014, 05:25 AM
Hi Tran Huy,
Please have a look into the sample code snippet which works fine at my end.
ASPX:
CSS:
Please provide your code if it doesn't help.
Thanks,
Shinu.
Please have a look into the sample code snippet which works fine at my end.
ASPX:
<telerik:RadListView ID="RadListView1" Width="25px" runat="server" Height="10px" DataSourceID="SqlDataSource1" ItemPlaceholderID="ProductsHolder" DataKeyNames="ProductID"> <LayoutTemplate> <fieldset style="max-width: 250px;" id="FieldSet1"> <legend>Products</legend> <asp:Panel ID="ProductsHolder" runat="server" /> </fieldset> </LayoutTemplate> <ItemTemplate> <fieldset> <legend>ProductID: <%#Eval("ProductID")%> </legend> <table> <tr> <td> ProductID: <td> <%#Eval("ProductID")%> </td> </tr> </table> </fieldset> </ItemTemplate> <AlternatingItemTemplate> <fieldset> <legend>ProductID: <%#Eval("ProductID")%> </legend> <table> <tr> <td> ProductID: <td> <%#Eval("ProductID")%> </td> </tr> </table> </fieldset> <div style="clear: both"> </div> </AlternatingItemTemplate></telerik:RadListView>CSS:
<style type="text/css"> #FieldSet1 { background-color: Gray !important; }</style>Please provide your code if it doesn't help.
Thanks,
Shinu.
0
Tran Huy
Top achievements
Rank 1
Rank 1
answered on 06 Feb 2014, 03:16 AM
Fill color like you is the same, but if you fill color by condition or following data, it's difference. if you try to access data in list view, it's difference, only effect half.
This sample I fill it's by condition.
you can test it.
this my code
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test7.aspx.cs" Inherits="Frontendtest.Test7" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href='CSS/TSListView.css' type="text/css" rel="stylesheet" />
<link href='Layout/Layoutfr.css' type="text/css" rel="stylesheet" />
<link href='Layout/site.css' type="text/css" rel="stylesheet" />
<script runat="server">
protected void ListView_ItemDataBound(object sender, RadListViewItemEventArgs e)
{
if (e.Item.ItemType == RadListViewItemType.DataItem)
{
foreach (var control in e.Item.Controls)
{
if (control is Label)
{
var lbl = (Label)control;
if (lbl.Text == "Ready")
lbl.CssClass = "bold";
else
lbl.CssClass = "Style2";
}
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
THIS IS TEST AUTO ARRANGE ROOM
</div>
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<asp:Panel runat="server" ID="ListViewPanel" Style="margin: 10px 0 0 0;">
<telerik:RadListView ID="RadListView2" runat="server" DataKeyNames="RoomID"
OnItemDataBound="ListView_ItemDataBound" ItemPlaceholderID="itemsContainer">
<LayoutTemplate>
<div class="RadListView RadListViewFloated">
<div class="rlvFloated">
<asp:Literal id="itemsContainer" runat="server"> </asp:Literal>
</div>
</div>
</LayoutTemplate>
<AlternatingItemTemplate>
<div class="rlvA"
style="height:60px; width:60px; margin-top:3px; margin-left:3px; margin-right:3px; margin-bottom:3px" >
<br />
<asp:Label ID="RoomIDLabel" runat="server" Text='<%# Eval("RoomID") %>' />
<br />
<asp:Label ID="RoomNameLabel" runat="server" Text='<%# Eval("RoomName") %>' />
<br />
<asp:Label ID="StatusLabel" runat="server" Text='<%# Eval("RoomStatus") %>' />
<br />
</div>
</AlternatingItemTemplate>
<ItemTemplate>
<div class="rlvI"
style="height:60px; width:60px; background-color:Azure; margin-top:3px; margin-left:3px; margin-right:3px; margin-bottom:3px">
<br />
<asp:Label ID="RoomIDLabel" runat="server" Text='<%# Eval("RoomID") %>' />
<br />
<asp:Label ID="RoomNameLabel" runat="server" Text='<%# Eval("RoomName") %>' />
<br />
<asp:Label ID="StatusLabel" runat="server" Text='<%# Eval("RoomStatus") %>' />
<br />
</div>
</ItemTemplate>
</telerik:RadListView>
</asp:Panel>
</form>
</body>
</html>
ASPX.CS
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;
using System.Configuration;
using Telerik.Web.UI;
namespace Frontendtest
{
public partial class Test7 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsPostBack) return;
LoadDataForSimpleDatabind();
}
private void LoadDataForSimpleDatabind()
{
RadListView2.DataSource = GetDataTable();
RadListView2.DataBind();
}
private DataTable GetDataTable()
{
string ConnString = ConfigurationManager.ConnectionStrings["mygiacattuong2014ConnectionString"].ConnectionString;
string query = "SELECT [RoomID], [RoomName], [RoomStatus]";
query += " FROM [Room]";
DataTable myDataTable = new DataTable();
using (SqlConnection conn = new SqlConnection(ConnString))
{
using (SqlDataAdapter adapter = new SqlDataAdapter())
{
adapter.SelectCommand = new SqlCommand(query, conn);
try
{
conn.Open();
adapter.Fill(myDataTable);
}
catch (Exception ex)
{
}
finally
{
conn.Close();
}
}
}
return myDataTable;
}
}
}
This sample I fill it's by condition.
you can test it.
this my code
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test7.aspx.cs" Inherits="Frontendtest.Test7" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href='CSS/TSListView.css' type="text/css" rel="stylesheet" />
<link href='Layout/Layoutfr.css' type="text/css" rel="stylesheet" />
<link href='Layout/site.css' type="text/css" rel="stylesheet" />
<script runat="server">
protected void ListView_ItemDataBound(object sender, RadListViewItemEventArgs e)
{
if (e.Item.ItemType == RadListViewItemType.DataItem)
{
foreach (var control in e.Item.Controls)
{
if (control is Label)
{
var lbl = (Label)control;
if (lbl.Text == "Ready")
lbl.CssClass = "bold";
else
lbl.CssClass = "Style2";
}
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
THIS IS TEST AUTO ARRANGE ROOM
</div>
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<asp:Panel runat="server" ID="ListViewPanel" Style="margin: 10px 0 0 0;">
<telerik:RadListView ID="RadListView2" runat="server" DataKeyNames="RoomID"
OnItemDataBound="ListView_ItemDataBound" ItemPlaceholderID="itemsContainer">
<LayoutTemplate>
<div class="RadListView RadListViewFloated">
<div class="rlvFloated">
<asp:Literal id="itemsContainer" runat="server"> </asp:Literal>
</div>
</div>
</LayoutTemplate>
<AlternatingItemTemplate>
<div class="rlvA"
style="height:60px; width:60px; margin-top:3px; margin-left:3px; margin-right:3px; margin-bottom:3px" >
<br />
<asp:Label ID="RoomIDLabel" runat="server" Text='<%# Eval("RoomID") %>' />
<br />
<asp:Label ID="RoomNameLabel" runat="server" Text='<%# Eval("RoomName") %>' />
<br />
<asp:Label ID="StatusLabel" runat="server" Text='<%# Eval("RoomStatus") %>' />
<br />
</div>
</AlternatingItemTemplate>
<ItemTemplate>
<div class="rlvI"
style="height:60px; width:60px; background-color:Azure; margin-top:3px; margin-left:3px; margin-right:3px; margin-bottom:3px">
<br />
<asp:Label ID="RoomIDLabel" runat="server" Text='<%# Eval("RoomID") %>' />
<br />
<asp:Label ID="RoomNameLabel" runat="server" Text='<%# Eval("RoomName") %>' />
<br />
<asp:Label ID="StatusLabel" runat="server" Text='<%# Eval("RoomStatus") %>' />
<br />
</div>
</ItemTemplate>
</telerik:RadListView>
</asp:Panel>
</form>
</body>
</html>
ASPX.CS
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;
using System.Configuration;
using Telerik.Web.UI;
namespace Frontendtest
{
public partial class Test7 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsPostBack) return;
LoadDataForSimpleDatabind();
}
private void LoadDataForSimpleDatabind()
{
RadListView2.DataSource = GetDataTable();
RadListView2.DataBind();
}
private DataTable GetDataTable()
{
string ConnString = ConfigurationManager.ConnectionStrings["mygiacattuong2014ConnectionString"].ConnectionString;
string query = "SELECT [RoomID], [RoomName], [RoomStatus]";
query += " FROM [Room]";
DataTable myDataTable = new DataTable();
using (SqlConnection conn = new SqlConnection(ConnString))
{
using (SqlDataAdapter adapter = new SqlDataAdapter())
{
adapter.SelectCommand = new SqlCommand(query, conn);
try
{
conn.Open();
adapter.Fill(myDataTable);
}
catch (Exception ex)
{
}
finally
{
conn.Close();
}
}
}
return myDataTable;
}
}
}
0
Hi,
The items in RadListView are of type DataItem and AlternatingItem. In your code the CssClass is applied only to Label controls that are placed in a DataItem. This is why every second Label does not have the "bold" CssClass.
In order to apply styles to all items you could modify the condition in your ItemDataBound handler like shown below:
Regards,
Viktor Tachev
Telerik
The items in RadListView are of type DataItem and AlternatingItem. In your code the CssClass is applied only to Label controls that are placed in a DataItem. This is why every second Label does not have the "bold" CssClass.
In order to apply styles to all items you could modify the condition in your ItemDataBound handler like shown below:
protected void ListView_ItemDataBound(object sender, RadListViewItemEventArgs e){ if (e.Item.ItemType == RadListViewItemType.DataItem || e.Item.ItemType == RadListViewItemType.AlternatingItem) { foreach (var control in e.Item.Controls) { if (control is Label) { var lbl = (Label)control; if (lbl.Text == "Ready") { lbl.CssClass = "bold"; } else { lbl.CssClass = "Style2"; } } } }}Regards,
Viktor Tachev
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
0
Tran Huy
Top achievements
Rank 1
Rank 1
answered on 07 Feb 2014, 03:29 PM
thank you Viktor, it's running