Private Sub LoadMenuItems() Dim MenuDC As New MenuItemDataContext RadMenu1.DataSource = MenuDC.usp_TABLE_MENU_ITEM_Select().ToList() RadMenu1.DataBind() End Sub<telerik:RadMenu ID="RadMenu1" runat="server" Skin="Office2007" DataFieldID="MENU_ITEM_ID" DataFieldParentID="PARENT_ID" DataNavigateUrlField="PAGE_URL" DataTextField="MENU_ITEM_NAME" DataValueField="MENU_ITEM_ID"> <DefaultGroupSettings ExpandDirection="Down" /><CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> </telerik:RadMenu><
telerik:RadAjaxLoadingPanel ID="radajaxloadingpanelAssociateEntities" runat="server" Transparency="50">
<div id="divLoadingPnl" runat="server" style="position: absolute; left: 400px; top: 250px">
<asp:Image ID="imgLoading" runat="server" AlternateText="Loading..." ImageUrl="~/wpresources/PIMS/Images/progress.gif"/>
</div>
</telerik:RadAjaxLoadingPanel>
<telerik:RadAjaxPanel ID="radajaxpanelAssociateEntities" LoadingPanelID="radajaxloadingpanelAssociateEntities"
runat="server" Height="650px" Width="948px">
<table border="0" cellpadding="0" cellspacing="0" style="width: 100%; height: 100%">
<tr style="width: 100%; height: 50%">
<td style="width: 278px">
<telerik:RadTreeView runat="server" ID="radtvFolderStructure"
OnLoad="radtvFolderStructure_Load" style="position: relative"
OnNodeClick="radtvFolderStructure_NodeClick" >
</telerik:RadTreeView>
</td><td>
<telerik:RadGrid ID="rdgDocuments" runat="server" Height="325" Width="670" Skin="Hay">
</telerik:RadGrid>
</td></tr><tr><td></td><td>
<telerik:RadGrid ID="rdgComments" runat="server" Height="325" Width="670" Skin="Hay">
</telerik:RadGrid>
</td></tr>
</table>
</telerik:RadAjaxPanel>
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %> <!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> <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" /> </head> <body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> <Scripts> <%--Needed for JavaScript IntelliSense in VS2010--%> <%--For VS2008 replace RadScriptManager with ScriptManager--%> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> </Scripts> </telerik:RadScriptManager> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"></telerik:RadAjaxManager> <div id="divContent" runat="server"> <telerik:RadCalendar ID="RadCalendar1" Runat="server"></telerik:RadCalendar> </div> </form> </body> </html>using System; using System.Drawing; using Telerik.Web.UI; public partial class Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { LoadDatesShared(); } void LoadDatesShared() { for (int i = 0; i < 10;i++ ) { RadDatePicker rdp = new RadDatePicker(); rdp.SharedCalendar = RadCalendar1; rdp.AutoPostBack = true; rdp.ID = "rdp" + i.ToString(); rdp.SelectedDateChanged += new Telerik.Web.UI.Calendar.SelectedDateChangedEventHandler(rdp_SelectedDateChanged); divContent.Controls.Add(rdp); RadAjaxManager1.AjaxSettings.AddAjaxSetting(rdp, rdp); } } void rdp_SelectedDateChanged(object sender, Telerik.Web.UI.Calendar.SelectedDateChangedEventArgs e) { ((RadDatePicker)sender).BackColor = Color.LightGreen; } }telerik:RadDatePicker ID="datepicker" runat="server" ClientEvents-OnDateSelected="DateValidator" MaxDate="2100-12-31" MinDate="1900-01-01" Culture="English (United States)" SelectedDate="2011-03-01" > <Calendar runat="server" UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x" FastNavigationStep="12" ></Calendar> <DatePopupButton ImageUrl="" HoverImageUrl="" CssClass=""></DatePopupButton> <DateInput ID="DI" runat="server" CausesValidation="true" DisplayDateFormat="M/d/yyyy" DateFormat="M/d/yyyy" LabelCssClass="" Width="" SelectedDate="2011-03-01" > <ClientEvents OnValueChanged="ValueChanged"/> </DateInput> </telerik:RadDatePicker></form></body></html><telerik:RadScriptBlock ID="SOSRadScriptBlock" runat="server"> <script type='text/javascript'> function ValueChanged(sender, args) { var dtv = $find(sender.controltovalidate).get_dateInput(); var temp = args.Value.trim(); if (temp != " " && !!temp) { args.IsValid = true; } else { //date input value is either null or has a space dtv._invalid = true; //Below is the last approach I tried to change the style dtv.get_styles().InvalidStyle[0] += "background-color: lemonchiffon;"; dtv.updateCssClass(); args.IsValid = false; } </script></telerik:RadScriptBlock>Hi,
1) I want a header in which there will be one main heading and under it there can be sub headings, the main header will span across its multiple sub headings, user can sort the grid by clicking on the sub headings. Please refer to the "UI.jpg"
2) The requirement is like i will be needing the Radgrid as usercontrol, which we will bind on Page. when we run the page, the screen looks fine except for the Merged Columns where in we need the headings and the Subheadeing, refer "Screenshot1.JPG"
The second issue which we I am facing is, The rad grd will have horizontal scroll and first 3 columns would be frozed.
But when we try to freeze the columns we face the following issues:
a) When we scroll, the complete alignment of the grid gets messed up, and one Grid line remains there and shows up in the middle of all scrolling columns. Refer "Screenshot2.JPG" .
b) After we scroll, the horizontal scroll itself disappears. Refer "Screenshot3.JPG" .
c) If we change the page size in pagination, the pagination also disappears. Refer "Screenshot4.JPG" .
Please refer to the code as well, We have created a user control "uclFleet.ascx" which we register in our page "Test_Fleet.aspx".
Please reply on an urgent basis.
Thanks.
<!--User control .ascx file--> <%@ Control Language="C#" AutoEventWireup="true" CodeFile="uclFleet.ascx.cs" Inherits="UserControls_uclFleet" %> <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> <script type="text/javascript"> function fnGridCreated(sender, args) { var scrollArea = sender.GridDataDiv; var dataHeight = sender.get_masterTableView().get_element().clientHeight; if (dataHeight < 350) { scrollArea.style.height = dataHeight + 10 + "px"; } } </script> <telerik:RadGrid ID="tlrkDgrFleet" runat="server" EnableViewState="true" CellPadding="0" CellSpacing="0" GridLines="Both" Width="750px" Skin="Office2007" HeaderStyle-Font-Size="8pt" HeaderStyle-Font-Bold="true" AllowPaging="true" ShowHeader="true" OnNeedDataSource="tlrkDgrFleet_NeedDataSource" OnItemDataBound="tlrkDgrFleet_OnItemDataBound"> <MasterTableView CellPadding="0" CellSpacing="0" Width="99%" TableLayout="Fixed" ShowHeader="true" AutoGenerateColumns="false" AllowPaging="true" ShowFooter="false"> <Columns> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" UniqueName="SerialNo" ItemStyle-HorizontalAlign="Right"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border: 0" rowspan="2"> Serial <br /> No. </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <asp:Label ID="lblSerialNo" runat="server"><%# Eval("A") %></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="100px" UniqueName="ColHeader" ItemStyle-HorizontalAlign="left"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="width:100%" colspan="2"> Column header <br /><hr /> </td> </tr> <tr> <td> Sub Col A </td> <td> Sub Col B </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <table border="0" cellpadding="0" cellspacing="0" > <tr> <td> <asp:Label ID="lblA" runat="server" ><%# Eval("B") %></asp:Label> </td> <td> <asp:Label ID="lblE" runat="server"><%# Eval("C") %></asp:Label> </td> </tr> </table> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="100px" UniqueName="Delivery" ItemStyle-HorizontalAlign="left"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border: 1" colspan="2"> Delivery<br /><hr /> </td> </tr> <tr> <td> Owner </td> <td> Operator </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <asp:Label ID="lblOwn" runat="server"><%# Eval("D") %></asp:Label> </ItemTemplate> <ItemTemplate> <asp:Label ID="lblOper" runat="server"><%# Eval("E") %></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="150px" UniqueName="Current" ItemStyle-HorizontalAlign="left"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" > <tr> <td style="border:0" colspan="3"> Current<br /><hr /> </td> </tr> <tr> <td> Own </td> <td> LEAST </td> <td> SLE123 </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <table border="0" cellpadding="0" cellspacing="0" > <tr> <td> <asp:Label ID="lblCurrOwn" runat="server"><%# Eval("F") %></asp:Label> </td> <td> <asp:Label ID="lblCurrLE" runat="server"><%# Eval("G")%></asp:Label> </td> <td> <asp:Label ID="lblCurrSLE" runat="server"><%# Eval("H") %></asp:Label> </td> </tr> </table> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" UniqueName="Future" ItemStyle-HorizontalAlign="left"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border: 0" rowspan="2"> Future <br /> Owner </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <asp:Label ID="lblr" runat="server"><%# Eval("I") %></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" UniqueName="Bus" ItemStyle-HorizontalAlign="left"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border: 0" rowspan="2"> Bus <br /> Contract </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <asp:Label ID="lblBusCon" runat="server"><%# Eval("J") %></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" UniqueName="Number" ItemStyle-HorizontalAlign="left"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border: 0" rowspan="2"> House <br /> Number </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <asp:Label ID="lblNo" runat="server"><%# Eval("K") %></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" UniqueName="CurrentSet" ItemStyle-HorizontalAlign="left"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border: 0" rowspan="2"> Current <br /> Set. </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <asp:Label ID="lblCurrentSet" runat="server"><%# Eval("L") %></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" UniqueName="LaneNo" ItemStyle-HorizontalAlign="left"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border: 0" rowspan="2"> Lane <br /> No. </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <asp:Label ID="lblLaneNo" runat="server"><%# Eval("M") %></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" UniqueName="PurDate" ItemStyle-HorizontalAlign="center"> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border: 0" rowspan="2"> Purchase <br /> Date </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <asp:Label ID="lblDeliveryDate" runat="server"><%# Eval("N") %></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> </Columns> </MasterTableView> <ClientSettings> <Scrolling AllowScroll="true" FrozenColumnsCount= "3" UseStaticHeaders="true" SaveScrollPosition="true" /> <ClientEvents OnGridCreated="fnGridCreated" /> </ClientSettings> </telerik:RadGrid>//User Control uclFleet.ascx.cs file using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using Telerik.Web.UI; using System.Text; public partial class UserControls_uclFleet : System.Web.UI.UserControl { protected void tlrkDgrFleet_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e) { DataTable dt = new DataTable(); dt.Columns.Add("A"); dt.Columns.Add("B"); dt.Columns.Add("C"); dt.Columns.Add("D"); dt.Columns.Add("E"); dt.Columns.Add("F"); dt.Columns.Add("G"); dt.Columns.Add("H"); dt.Columns.Add("I"); dt.Columns.Add("J"); dt.Columns.Add("K"); dt.Columns.Add("L"); dt.Columns.Add("M"); dt.Columns.Add("N"); for (int i = 0; i < 10; i++) { DataRow dr; dr = dt.NewRow(); dr["A"] = "1234"; dr["B"] = "ABCD - hjkl"; dr["C"] = "123-90"; dr["D"] = "13434"; dr["E"] = "1545"; dr["F"] = "1656"; dr["G"] = "1453"; dr["H"] = "15435"; dr["I"] = "5341"; dr["J"] = "1345"; dr["K"] = "135"; dr["L"] = "135"; dr["M"] = "1345"; dr["N"] = "11/07/2010"; dt.Rows.Add(dr); DataRow dr1; dr1 = dt.NewRow(); dr1["A"] = "1234"; dr1["B"] = "AWER - POUT"; dr1["C"] = "123-90"; dr1["D"] = "13434"; dr1["E"] = "1545"; dr1["F"] = "1656"; dr1["G"] = "ASD"; dr1["H"] = "15435"; dr1["I"] = "DSFSF"; dr1["J"] = "1345"; dr1["K"] = "135"; dr1["L"] = "EWEWR"; dr1["M"] = "1345"; dr1["N"] = "11/07/2010"; dt.Rows.Add(dr1); } tlrkDgrFleet.DataSource = dt; } protected void tlrkDgrFleet_OnItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e) { } }<!-- Test_Fleet.aspx--><%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test_Fleet.aspx.cs" Inherits="Test_Fleet" %> <%@ Register Src="~/UserControls/uclFleet.ascx" TagName="uclFleet" TagPrefix="uc2" %> <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> <!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> </head> <body> <form id="form1" runat="server"> <table style="table-layout:fixed" width="100%"><tr><td> <uc2:uclFleet ID="uclFleet" runat="server" /> </td></tr> </table> </form> </body> </html> |
Requirements |
|
| RadControls version | |
| .NET version : 3.5 | |
| Visual Studio version : 2008 |
|
| programming language : C# |
|
| browser support |
all browsers supported by RadControls |