Telerik Forums
UI for ASP.NET AJAX Forum
7 answers
211 views
I have two grids : the first grid is hierarchical and the second grid synchronizes its data with the first one.

The problem is : I can't get the same height for both of them. I tried a lot of things ... can you please help me ?

One thing I remarked just now : I added some rows in "Employees" table and a vertical scroll appears in grid2. I really don't understand how the height of this grid is predefined ... I wonder if it is ever possible to have the same height for both grids.

Here is the code, just change the connection to Northwind  database in "GetConnectionString()" method 

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="RadGridSolutionTelerikLines.aspx.cs" Inherits="RadGridSolutionTelerikLines" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
   <title></title> 
    <style type="text/css"> 
      .StaticColumn 
      {     
          font-family: Arial,Verdana, Helvetica; 
        font-size: 14px; 
        font-weight: normal;    
          border: none; 
          position: relative; 
      }  
  
        .RadGrid td{padding:0}  
         
       .rgExpand   
        {   
          background:url('Images/CollapsedButton.gif') center no-repeat !important;        
        }   
       
       .rgCollapse   
        {   
          background:url('Images/ExpandedButton.gif') center no-repeat !important;   
        }  
         
.RadGrid_Vista tr.DetailRow 
{ 
    background:#ebe4d6; 
} 
 
.DetailTable_Vista 
{ 
    background:#f4ede1; 
} 
 
.RadGrid_Vista .DetailTable_Vista .GridHeader_Vista, 
.RadGrid_Vista .DetailTable_Vista .ResizeHeader_Vista 
{ 
    padding-top:2px; 
    padding-bottom:2px; 
    background-position:0 -6px; 
}         
    </style>      
</head> 
<body> 
    <form runat="server" id="mainForm" method="post">         
      <telerik:RadScriptManager ID="RadScriptManager1" runat="server" /> 
        <!-- content start --> 
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> 
            <AjaxSettings> 
                <telerik:AjaxSetting AjaxControlID="RadGrid1"> 
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" />   
                        <telerik:AjaxUpdatedControl ControlID="RadGrid2" />                       
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
            </AjaxSettings> 
        </telerik:RadAjaxManager> 
        <!-- DataSourceID="SqlDataSource1" --> 
        <table border="0" cellspacing="0" cellpadding="0" style="height:100%;">  
        <tr> 
        <td style="vertical-align:top;height:100%">         
        <telerik:RadGrid ID="RadGrid1" Skin="Vista" OnPreRender="RadGrid1_PreRender"  
                runat="server" DataSourceID="SqlDataSource1"  OnColumnCreated="RadGrid1_ColumnCreated" 
            OnItemCreated="RadGrid1_ItemCreated" OnItemDataBound="RadGrid1_ItemDataBound"  
                Width="100%" onselectedindexchanged="RadGrid1_SelectedIndexChanged"> 
            <MasterTableView  HierarchyDefaultExpanded="false" EnableNoRecordsTemplate="false" HierarchyLoadMode="ServerBind" AllowSorting="true" Width="800px" 
                DataKeyNames="EmployeeID" ExpandCollapseColumn-ButtonType="ImageButton" ExpandCollapseColumn-Display="true" 
                ExpandCollapseColumn-ExpandImageUrl="Images/CollapsedButton.gif" ExpandCollapseColumn-CollapseImageUrl="Images/ExpandedButton.gif"> 
                <ItemStyle Wrap="false" Width="200px" BackColor="Azure" Height="17px" BorderWidth="1"/> 
                <AlternatingItemStyle Wrap="false" BackColor="BlanchedAlmond" Width="200px" Height="17px" BorderWidth="1"/> 
                <HeaderStyle Wrap="false" Width="1500px" Height="20px"/> 
                 
                <SelfHierarchySettings ParentKeyName="ReportsTo" KeyName="EmployeeID"/>                 
                 
            </MasterTableView> 
             
            <ClientSettings AllowExpandCollapse="true" EnablePostBackOnRowClick="true" EnableRowHoverStyle="true">       
            <Selecting AllowRowSelect="true" />       
            </ClientSettings> 
        </telerik:RadGrid> 
        </td> 
        <td class="StaticColumn" style="vertical-align:top;height:auto;">  
        <telerik:RadGrid ID="RadGrid2" ShowStatusBar="true" EnableViewState="true" 
            runat="server" AutoGenerateColumns="true" AllowSorting="False" AllowMultiRowSelection="False" Width="800px" GridLines="None"> 
            <MasterTableView ItemStyle-Wrap="false" Height="20px">       
            <HeaderStyle Wrap="false" Height="20px"/>             
            <AlternatingItemStyle Height="17px"  BackColor="BlanchedAlmond" Wrap="false" />  
            <ItemStyle Height="17px"  BackColor="Azure" Wrap="false" />             
                <Columns> 
                    <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton" 
                        DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton" 
                        DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton" 
                        DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton" 
                        DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton" 
                        DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn>  
                    <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton" 
                        DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton" 
                        DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton" 
                        DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton" 
                        DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton" 
                        DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn>      
                    <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton" 
                        DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton" 
                        DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton" 
                        DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton" 
                        DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton" 
                        DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn>  
                    <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton" 
                        DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton" 
                        DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton" 
                        DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton" 
                        DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton" 
                        DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="17px"> 
                    </telerik:GridBoundColumn>                                                         
                </Columns> 
            </MasterTableView> 
            <clientsettings allowexpandcollapse="false" EnableRowHoverStyle="true">                 
                    <Scrolling AllowScroll="true" UseStaticHeaders="True"></Scrolling> 
            </clientsettings> 
             
        </telerik:RadGrid> 
        </td> 
        </tr> 
        </table>         
        <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
            ProviderName="System.Data.SqlClient" SelectCommand="SELECT EmployeeID, LastName, FirstName, Title, ReportsTo FROM Employees" 
            runat="server"></asp:SqlDataSource> 
        <!-- content end --> 
    </form> 
</body> 
</html> 
 
 
 
 
 
using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using Telerik.Web.UI; 
using System.Reflection; 
using System.Data; 
using System.Data.SqlClient;  
 
public partial class RadGridSolutionTelerikLines : System.Web.UI.Page 
{ 
 
    public void Page_Load(object sender, EventArgs e) 
    { 
        bindGrid2(); 
        
        if (Assembly.GetAssembly(typeof(ScriptManager)).FullName.IndexOf("3.5") != -1) 
        { 
            RadGrid1.MasterTableView.FilterExpression = @"it[""ReportsTo""] = Convert.DBNull"; 
        } 
        else 
        { 
            RadGrid1.MasterTableView.FilterExpression = "ReportsTo IS NULL"; 
        } 
 
        if (RadGrid1.MasterTableView.DetailTables != null) 
        { 
            RadGrid1.MasterTableView.DetailTables[0].AlternatingItemStyle.BackColor = System.Drawing.Color.Azure  ; 
            RadGrid1.MasterTableView.DetailTables[0].ItemStyle.BackColor = System.Drawing.Color.BlanchedAlmond; 
 
            if (RadGrid1.MasterTableView.DetailTables[0].DetailTables[0] != null) 
            { 
                RadGrid1.MasterTableView.DetailTables[0].DetailTables[0].AlternatingItemStyle.BackColor = System.Drawing.Color.Azure; 
                RadGrid1.MasterTableView.DetailTables[0].DetailTables[0].ItemStyle.BackColor = System.Drawing.Color.BlanchedAlmond; 
            } 
        } 
 
    } 
 
    public void Page_PreRenderComplete(object sender, EventArgs e) 
    { 
        HideExpandColumnRecursive(RadGrid1.MasterTableView); 
 
        string ActualNodes = string.Empty; 
 
        foreach (GridDataItem dataItem in RadGrid1.Items) 
        { 
            if (dataItem.Visible) 
            { 
                ActualNodes += dataItem["EmployeeID"].Text + ","; 
            } 
        } 
 
 
        if (ActualNodes.Length > 0) 
            ActualNodesActualNodes = ActualNodes.Substring(0, ActualNodes.Length - 1); 
 
        RadGrid2.Controls.Clear(); 
        RadGrid2.DataSource = getDetails(ActualNodes); 
        RadGrid2.DataBind(); 
 
        if (Session["RadGrid1_SelectedValue"] != null) 
        { 
            for (int m = 0; m < RadGrid2.Items.Count; m++) 
            { 
                if (RadGrid2.Items[m]["EmployeeID"].Text.Equals(Session["RadGrid1_SelectedValue"].ToString())) 
                { 
                    RadGrid2.Items[m].Selected = true; 
                } 
            } 
        } 
 
 
    } 
 
    public void HideExpandColumnRecursive(GridTableView tableView) 
    { 
        GridItem[] nestedViewItems = tableView.GetItems(GridItemType.NestedView); 
        foreach (GridNestedViewItem nestedViewItem in nestedViewItems) 
        { 
            foreach (GridTableView nestedView in nestedViewItem.NestedTableViews) 
            { 
                nestedView.Style["border"] = "0"; 
 
                Button MyExpandCollapseButton = (Button)nestedView.ParentItem.FindControl("MyExpandCollapseButton"); 
                if (nestedView.Items.Count == 0) 
                { 
                    if (MyExpandCollapseButton != null) 
                    { 
                        MyExpandCollapseButton.Style["visibility"] = "hidden"; 
                    } 
                    nestedViewItem.Visible = false; 
                } 
                else 
                { 
                    if (MyExpandCollapseButton != null) 
                    { 
                        MyExpandCollapseButton.Style.Remove("visibility"); 
                    } 
                } 
 
                if (nestedView.HasDetailTables) 
                { 
                    HideExpandColumnRecursive(nestedView); 
                } 
            } 
        } 
    } 
 
    protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e) 
    { 
        CreateExpandCollapseButton(e.Item, "EmployeeID"); 
 
        if (e.Item is GridHeaderItem && e.Item.OwnerTableView != RadGrid1.MasterTableView) 
        { 
            e.Item.Style["display"] = "none"; 
        } 
 
        if (e.Item is GridNestedViewItem) 
        { 
            e.Item.Cells[0].Visible = false; 
 
            Table table = (Table)e.Item.OwnerTableView.Controls[0]; 
 
            GridItem prevItem = (GridItem)table.Rows[table.Rows.Count - 2]; 
            // Why -3? We need to skip the NestedViewItem and the preceding DataItem's invisible EditItem 
 
            if (prevItem.ItemType == GridItemType.AlternatingItem) 
            { 
                e.Item.CssClass = "DetailAltRow"; 
            } 
            else 
            { 
                e.Item.CssClass = "DetailRow"; 
            } 
            /* 
            e.Item.Cells[0].CssClass = "DetailRowCell"; 
            e.Item.Cells[1].CssClass = "DetailRowCell"; 
             */ 
        } 
 
    
    } 
 
    protected void RadGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e) 
    { 
        if (e.Column is GridExpandColumn) 
        { 
            e.Column.Visible = false; 
        } 
        else if (e.Column is GridBoundColumn) 
        { 
            e.Column.HeaderStyle.Width = Unit.Pixel(100); 
        } 
    } 
 
    protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e) 
    { 
        CreateExpandCollapseButton(e.Item, "EmployeeID"); 
    } 
 
    public void CreateExpandCollapseButton(GridItem item, string columnUniqueName) 
    { 
        if (item is GridDataItem) 
        { 
            if (item.FindControl("MyExpandCollapseButton") == null) 
            { 
                Button button = new Button(); 
                button.Click += new EventHandler(button_Click); 
                button.CommandName = "ExpandCollapse"; 
                button.CssClass = (item.Expanded) ? "rgCollapse" : "rgExpand"; 
                button.ID = "MyExpandCollapseButton"; 
 
                if (item.OwnerTableView.HierarchyLoadMode == GridChildLoadMode.Client) 
                { 
                    string script = String.Format(@"$find(""{0}"")._toggleExpand(this, event); return false;", item.Parent.Parent.ClientID); 
 
                    button.OnClientClick = script; 
                } 
 
                int level = item.ItemIndexHierarchical.Split(':').Length; 
                if (level > 1) 
                { 
                    button.Style["margin-left"] = level + 10 + "px"; 
                    button.Style["height"] = "15px"; 
                } 
 
 
                TableCell cell = ((GridDataItem)item)[columnUniqueName]; 
                cell.Controls.Add(button); 
 
                LiteralControl liSpace = new LiteralControl("&nbsp;"); 
                cell.Controls.Add(liSpace); 
 
                cell.Controls.Add(new LiteralControl(((GridDataItem)item).GetDataKeyValue(columnUniqueName).ToString())); 
                cell.Style["height"] = "15px"; 
 
            } 
        } 
    } 
 
    protected void RadGrid1_PreRender(object sender, EventArgs e) 
    { 
 
        string ActualNodes = string.Empty; 
 
        foreach (GridDataItem dataItem in RadGrid1.Items) 
        { 
            if (dataItem.Visible) 
            { 
                ActualNodes += dataItem["EmployeeID"].Text + ","; 
            } 
        } 
 
 
        if (ActualNodes.Length > 0) 
            ActualNodesActualNodes = ActualNodes.Substring(0, ActualNodes.Length - 1); 
 
        RadGrid2.Controls.Clear(); 
        RadGrid2.DataSource = getDetails(ActualNodes); 
        RadGrid2.DataBind(); 
        //Response.Write("<script> alert(" + sTest + ");</script>");  
    } 
 
 
    void button_Click(object sender, EventArgs e) 
    { 
        ((Button)sender).CssClass = (((Button)sender).CssClass == "rgExpand") ? "rgCollapse" : "rgExpand"; 
    } 
 
 
    private void bindGrid2() 
    { 
 
        RadGrid2.Controls.Clear(); 
        string initialNodes = string.Empty; 
        for (int m = 0; m < RadGrid1.Items.Count; m++) 
        { 
            if (!RadGrid1.Items[m]["EmployeeID"].Text.ToLower().Equals("&nbsp;") && RadGrid1.Items[m].Visible) 
                initialNodes += RadGrid1.Items[m]["EmployeeID"].Text + ","; 
        } 
 
        if (initialNodes.Length > 0) 
        { 
            RadGrid2.DataSource = getEmployees(initialNodes.Substring(0, initialNodes.Length - 1)); 
        } 
        else 
            RadGrid2.DataSource = getEmployees(""); 
 
        RadGrid2.DataBind(); 
    } 
 
    private DataView getEmployees(string initialNodes) 
    { 
        DataSet ds = new DataSet(); 
 
        string sqlFinal = string.Empty; 
        if (!initialNodes.Equals(string.Empty)) 
        { 
            sqlFinal = "Where EmployeeID in (" + initialNodes + ")"; 
        } 
 
        using (SqlConnection conn = new SqlConnection()) 
        { 
            conn.ConnectionString = GetConnectionString(); 
            SqlCommand cmd = new SqlCommand("SELECT [EmployeeID], [LastName], [FirstName], [Title], [ReportsTo] FROM [Employees] " + sqlFinal, conn); 
            conn.Open(); 
 
            SqlDataAdapter sqlAdapter = new SqlDataAdapter(cmd); 
 
            sqlAdapter.Fill(ds); 
        } 
 
        DataView dv = new DataView(ds.Tables[0]); 
        return dv; 
    } 
 
    private DataTable getChildNodesByID(string ParentID) 
    { 
        DataSet ds = new DataSet(); 
        string sql = "SELECT [EmployeeID], [LastName], [FirstName], [Title], [ReportsTo] FROM [Employees] Where ReportsTo = " + ParentID; 
 
        using (SqlConnection conn = new SqlConnection()) 
        { 
            conn.ConnectionString = GetConnectionString(); 
            SqlCommand cmd = new SqlCommand(sql, conn); 
            conn.Open(); 
 
            SqlDataAdapter sqlAdapter = new SqlDataAdapter(cmd); 
            sqlAdapter.Fill(ds); 
        } 
 
        DataTable dt = new DataTable(); 
        if (ds != null && ds.Tables.Count > 0 && ds.Tables[0].Rows.Count > 0) 
            return ds.Tables[0]; 
        else 
            return null; 
    } 
 
    private DataView getDetails(string ActualNodes) 
    { 
        DataSet ds = new DataSet(); 
 
 
        //string noeuds = ActualNodes.Substring(0, ActualNodes.Length - 1);  
 
        string[] tabNoeuds = ActualNodes.Split(','); 
        string swhen = " CASE "; 
 
        for (int i = 0; i < tabNoeuds.Length; i++) 
        { 
            swhen += " WHEN EmployeeID = " + tabNoeuds[i] + " THEN " + (i + 1) + " "; 
        } 
        swhen += " END "; 
 
        string sql = "SELECT [EmployeeID], [LastName], [FirstName], [Title], [ReportsTo] FROM [Employees] Where EmployeeID in (" + ActualNodes + ")"; 
        sql += " ORDER BY " + swhen; 
        using (SqlConnection conn = new SqlConnection()) 
        { 
            conn.ConnectionString = GetConnectionString(); 
            SqlCommand cmd = new SqlCommand(sql, conn); 
            conn.Open(); 
 
            SqlDataAdapter sqlAdapter = new SqlDataAdapter(cmd); 
            sqlAdapter.Fill(ds); 
        } 
 
        DataView dv = new DataView(ds.Tables[0]); 
        return dv; 
    } 
 
 
 
    static private string GetConnectionString() 
    { 
        return "server=STATION00374;database=Northwind;Integrated Security=SSPI;"; 
    } 
 
 
    protected void RadGrid1_SelectedIndexChanged(object sender, EventArgs e) 
    { 
       if (Session["RadGrid1_SelectedValue"] != null) 
            Session.Remove("RadGrid1_SelectedValue"); 
 
        Session["RadGrid1_SelectedValue"] = RadGrid1.SelectedValue.ToString();  
    } 
} 
 

RadTony
Top achievements
Rank 1
 answered on 09 Feb 2010
1 answer
87 views
Hi,

I want to create a portal, where I can see my appointments and the appointments of my team or appointments of work. It should look like this demo: http://demos.telerik.com/aspnet-ajax/scheduler/examples/outlook2007/defaultcs.aspx.

How can I configure the radCalendar and the radScheduler that I can choose team-, work and my personal appointments?


Best regards,
Marco


Peter
Telerik team
 answered on 09 Feb 2010
1 answer
119 views

Hi

       I am having the issue in Hide/Unhide column in RadGrid. I came to know the problem comes only after setting the custom styles for HeaderStyle template. Otherwise it is working awesomely.

 

I used the following styles for Headers

.HeaderStyle

{

      padding-top: 5px! important;

      display: block! important;

      text-decoration: none! important;

      font-weight: bold! important;

}

 

Also I used to apply the style as below

 

<HeaderStyle CssClass="HeaderStyle" />

 

 

So when I remove the Header Style section no problem finding in it. So how can I make both the functionalities working fine?

 

 

-Thanks in Advance

Schlurk
Top achievements
Rank 2
 answered on 09 Feb 2010
2 answers
820 views
With Telerik I can export my grid to Excel, Word and PDF.  However, is there a way to click a button open outlook and attach the grid to the email?

If that's possible, can the "To", "Subject" and "Body" be filled in with data?

I hope there is a way, thanks!
Daniel
Telerik team
 answered on 09 Feb 2010
2 answers
143 views
Hi All,

How to attach report extracted from the grid as attachment in an email without saving the exported report as a file in server or at client End.
Currently I can export the grid data into a file at server and attaching it to the email.
I does not want to save the report in server or at clientlocation.
I just want to attach the exported report as attachment in email and send to client.

Thanks in advance
-Anto
Daniel
Telerik team
 answered on 09 Feb 2010
1 answer
102 views
I have a Tabstrip with 2 tabs.

In each tab I have 10 radtextbox (multiline, with message for empty message). The first tab doesnt have any problems for moving among the textboxes, but when I select the second tab, I experiment a 2-3 seconds for moving among the textboxes.

Any suggestion?
Schlurk
Top achievements
Rank 2
 answered on 09 Feb 2010
3 answers
135 views
I am trying to do something similiar to your demo for an advanced editor.

http://demos.telerik.com/aspnet-ajax/editor/examples/editorinradwindow/defaultcs.aspx

Where mine differs is that my editor is already contained in a RadWindow.  It functions, but the problem is that the advanced editor window needs to be larger than the window it was called from.  I followed another thread/demo I found that shows how to call a window using the parent window and the window opens up, but now the content does not get passed back and forth because the client events no longer fire. I have attached my client side code for your review.

Main Editor:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="MessageManagement.aspx.vb" Inherits="MessageManagement" %> 
<%@ 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>Message Management</title> 
</head> 
<body> 
    <form id="form1" runat="server">  
    <div> 
        <telerik:RadScriptManager ID="rsmMessageManagement" runat="server">  
        </telerik:RadScriptManager>    
        <script type="text/javascript">  
            //<![CDATA[
            var editorContent = null;
            Telerik.Web.UI.Editor.CommandList["RichEditor"] = function(commandName, editor, args) {
                editorContent = editor.get_html(true); //get RadEditor content
                openRadWindow("DialogWindow", "MessageEditorAdvanced.aspx");
            };
            function GetRadWindow() {
                var oWindow = null;
                if (window.radWindow)
                    oWindow = window.radWindow;
                else if (window.frameElement.radWindow)
                    oWindow = window.frameElement.radWindow;
                return oWindow;
            }
            function openRadWindow(windowName, url) {
                var parentWindow = GetRadWindow().get_windowManager();
                var oWindow = parentWindow.open(url, windowName);
                oWindow.setSize(700, 550);
                oWindow.center();
                oWindow.show();
            }
            function SetEditorContent(content) {
                //set content to RadEditor on the mane page from RadWindow
                $find("<%= reMessage.ClientID %>").set_html(content);
            }
            function SetDialogContent(oWnd) {
                var contentWindow = oWnd.get_contentFrame().contentWindow;
                if (contentWindow && contentWindow.setContent) {
                    window.setTimeout(function() {
                        //pass and set the content from the mane page to RadEditor in RadWindow
                        contentWindow.setContent(editorContent);
                    }, 500);
                }
            }
            //]]> 
        </script> 
 
        <telerik:RadEditor ID="reMessage" runat="server" 
            EnableResize="false" 
            Width="100%" 
            Height="200px">  
            <Tools> 
                <telerik:EditorToolGroup> 
                    <telerik:EditorTool Name="RichEditor" Text="Open Advanced Editor" /> 
                    <telerik:EditorTool Name="Bold" /> 
                    <telerik:EditorTool Name="Italic" /> 
                    <telerik:EditorTool Name="Underline" /> 
                    <telerik:EditorTool Name="Cut" /> 
                    <telerik:EditorTool Name="Copy" /> 
                    <telerik:EditorTool Name="Paste" /> 
                    <telerik:EditorTool Name="FontName" /> 
                    <telerik:EditorTool Name="RealFontSize" /> 
                </telerik:EditorToolGroup> 
            </Tools> 
            <Content> 
            </Content> 
        </telerik:RadEditor> 
 
        <telerik:RadWindow OnClientShow="SetDialogContent" OnClientPageLoad="SetDialogContent" 
            NavigateUrl="MessageEditorAdvanced.aspx" runat="server" Behaviors="Maximize,Close,Move" 
            ID="DialogWindow" VisibleStatusbar="false" Width="800px" Modal="true" Height="700px" /> 
    </div> 
    </form> 
</body> 
</html> 
 

Advanced Editor:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="MessageEditorAdvanced.aspx.vb" Inherits="MessageEditorAdvanced" %> 
<%@ 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>Advanced Message Editor</title> 
        <style type="text/css">  
        html, form, body  
        {  
            height: 100%;  
            margin: 0px;  
        }  
 
        #editor1Bottom UL  
        {  
            float:right !important;  
        }  
        </style> 
</head> 
<body style="margin:0px;" scroll="no">  
    <form id="form1" runat="server">  
    <div> 
        <telerik:RadScriptManager ID="rsmMessageManagement" runat="server">  
        </telerik:RadScriptManager>    
        <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">  
        </telerik:RadStyleSheetManager> 
 
        <script type="text/javascript">  
            //<![CDATA[
            function GetRadWindow()
            {
                  var oWindow = null;
                  if (window.radWindow) oWindow = window.radWindow;
                  else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;
                  return oWindow;
            }
            function setContent(content) {
                var editor = $find("<%= reMessage.ClientID %>");
                if (editor) editor.set_html(content); //set content from the parent page to RadEditor in RadWindow
            }
            function OnClientLoad(editor)            
            {
                var editor = $find("<%= reMessage.ClientID %>");
                editor.fire("ToggleScreenMode"); //set RadEditor in Full Scree mode
            }
            function OnClientCommandExecuting(editor, args) {
                var commandName = args.get_commandName(); //returns the executed command
                if (commandName == "SaveAndClose") {
                    var radWindow = GetRadWindow();
                    radWindow.close();
                    args.set_cancel(true);
                }
            }
            //]]> 
        </script> 
 
        <telerik:RadEditor ID="reMessage" runat="server" 
            EnableResize="false" 
            OnClientLoad="OnClientLoad" 
            OnClientCommandExecuting="OnClientCommandExecuting" 
            ToolsFile="~/Shared/XmlLibraries/MessageEditorTools.xml">  
            <Content> 
            </Content> 
        </telerik:RadEditor> 
    </div> 
    <telerik:RadAjaxManager runat="server">  
    </telerik:RadAjaxManager> 
    </form> 
</body> 
</html> 
 


Seth
Fiko
Telerik team
 answered on 09 Feb 2010
7 answers
727 views
I'm using a RadComboBox with LoadOnDemand and an Item Template.  The Template has a table with a width of 600 and I have set the DropDownWidth to 400 due to space available for the dropdown.  However when the items load the dropdown hieght doesn't show the entire height of a templated item when the horizontal scrollbar is visible, also I am also using a header and footer template.  Is this a known problem that the dropdown height doesn't account for the scrollbar height?  And do you have a fix or a timeframe to expect this to be fixed?
Kalina
Telerik team
 answered on 09 Feb 2010
1 answer
138 views
Hi,
 I have a telerik hierachical grid as below and I wish to rows at the child level. However when I click add a new row only rows at the parent level are displayed. How do I go about adding child rows

regards

Robert Smith

<telerik:RadGrid ID="RadGrid1" runat="server" AllowFilteringByColumn="True"  AllowMultiRowEdit="true" AllowPaging="True" AllowAutomaticUpdates="True"
    AllowSorting="True" GridLines="None" DataSourceID="sds_requests_by_status" AutoGenerateColumns="False"  AllowAutomaticInserts="true"
        AutoGenerateHierarchy="True"  OnNeedDataSource="RadGrid1_NeedDataSource" Skin="WebBlue" OnItemDataBound="RadGrid1_ItemDataBound" OnItemCommand="RadGrid1_ItemCommand">
    <MasterTableView DataKeyNames="id"  DataSourceID="sds_requests_by_status" CommandItemDisplay="top"   EditMode="InPlace">
        <DetailTables >
                    <telerik:GridTableView DataKeyNames="id" DataSourceID="sds_products_by_request" Width="100%" runat="server">
                        <ParentTableRelation>
                            <telerik:GridRelationFields DetailKeyField="id" MasterKeyField="id" />
                        </ParentTableRelation>
                        <Columns>
                             <telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="editcolumn">
                              <ItemStyle CssClass="MyImageButton" /> </telerik:GridEditCommandColumn>
                                  <telerik:GridBoundColumn SortExpression="id" HeaderText="id"  AllowFiltering="false" ReadOnly="true" HeaderButtonType="TextButton"
                                DataField="id" UniqueName="id" >
                            </telerik:GridBoundColumn>
                             <telerik:GridBoundColumn  AllowFiltering="false" SortExpression="session_id" HeaderText="session_id"  ReadOnly="true" HeaderButtonType="TextButton"
                                DataField="session_id" UniqueName="session_id" Visible="False">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn  AllowFiltering="false" SortExpression="product_code" HeaderText="product code" ReadOnly="true" HeaderButtonType="TextButton"
                                DataField="product_code" UniqueName="product_code">
                            </telerik:GridBoundColumn>
                              <telerik:GridBoundColumn allowfiltering="false" SortExpression="description" HeaderText="description" ReadOnly="true" HeaderButtonType="TextButton"
                                DataField="description" UniqueName="description">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn AllowFiltering="false" SortExpression="supplier_code" HeaderText="Supplier code" ReadOnly="true" HeaderButtonType="TextButton"
                                DataField="supplier_code" UniqueName="supplier_code">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn AllowFiltering="false" SortExpression="price" HeaderText="Price" ReadOnly="true" HeaderButtonType="TextButton"
                                DataField="price" UniqueName="price">
                            </telerik:GridBoundColumn>
                              <telerik:GridBoundColumn allowfiltering="false" SortExpression="currency_code" HeaderText="Currency code" ReadOnly="true" HeaderButtonType="TextButton"
                                DataField="currency_code" UniqueName="currency_code">
                            </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn allowfiltering="false"  SortExpression="quantity" HeaderText="Unit quantity" ColumnEditorID="edit_quantity"  HeaderButtonType="TextButton"
                                DataField="quantity" UniqueName="quantity">
                            </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn allowfiltering="false"  ReadOnly="true" Visible="false" SortExpression="" HeaderText="Product_price_id" ColumnEditorID="edit_product_price_id"  HeaderButtonType="TextButton"
                                DataField="Product_Price_Id" UniqueName="Product_Price_Id">
                            </telerik:GridBoundColumn>
                            
                        </Columns>
                    </telerik:GridTableView>
          </DetailTables>            
        <Columns>
              <telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="editcolumn">
                    <ItemStyle CssClass="MyImageButton" />
                </telerik:GridEditCommandColumn>
            <telerik:GridBoundColumn DataField="id" DataType="System.Int32" HeaderText="Request No." ReadOnly="True"
                SortExpression="id" UniqueName="id"  >
            </telerik:GridBoundColumn>
            
            <telerik:GridDropDownColumn FilterControlWidth="160px"   DataField="request_status" DataSourceID="sds_request_status"
            HeaderText="Request Status" ListTextField="Request_status" ListValueField="request_status"  Display="false"
            UniqueName="request_status" ColumnEditorID="GridDropDownColumnEditor1">
                        <FilterTemplate>
                            <telerik:RadComboBox ID="RadCbo_Request_status" DataSourceID="sds_request_status" DataTextField="request_status"
                                DataValueField="request_status" Height="200px" AppendDataBoundItems="true"
                                SelectedValue='<%#((GridItem)Container).OwnerTableView.GetColumn("request_status").CurrentFilterValue %>'

                                runat="server" OnClientSelectedIndexChanged="RequestStatusChanged">
                                <Items>
                                    <telerik:RadComboBoxItem Text="All" />
                                </Items>
                                
                            </telerik:RadComboBox>
                            <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
                                <script type="text/javascript">
                                    function RequestStatusChanged(sender, args) {
                                        var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
                                        tableView.filter("request_status", args.get_item().get_value(), "EqualTo");
                                    }
                                </script>
                            </telerik:RadScriptBlock>
                        
</FilterTemplate>
             <HeaderStyle Width="160px" />
        </telerik:GridDropDownColumn>
           

Princy
Top achievements
Rank 2
 answered on 09 Feb 2010
1 answer
232 views
Hi,
I am creating a grid at runtime (code behind) which could be either in view or edit mode depending on a user selection.
I have two ways to display the grid in view or edit mode.

For view mode:
Using the GridBoundColumn like below
                'if the field is always in view mode, no editing of data  
                column = New GridBoundColumn()  
                column.DataField = controlID 'eg "COL1"  
                column.UniqueName = controlID  
                grid.MasterTableView.Columns.Add(column)  
 

Or use GridTemplateColumn like below with ViewTemplate implementing ITemplate.
                    column = New GridTemplateColumn()  
                    column.ItemTemplate = New ViewTemplate(controlID)  
 


For edit mode:
Use GridTemplateColumn, set the columns in edit mode (true/false) using the PreRender event. ItemTemplate and EditItemTemplate would be used depending view/edit.

Or use only GridTemplateColumn with ItemTemplate with textbox controls for edit. And use GridBoundColumn for view mode. This way I don't need to loop through the columns in the prerender event to set the columns to edit mode. By using the GridTemplateColumn I would have the columns set to edit mode.

I am leaning towards the last option, I would like to know your opinion. Thanks!





Princy
Top achievements
Rank 2
 answered on 09 Feb 2010
Narrow your results
Selected tags
Tags
+? more
Top users last month
Jake
Top achievements
Rank 1
RBarnes
Top achievements
Rank 1
Iron
Iron
Rami
Top achievements
Rank 1
Iron
Veteran
Nathan
Top achievements
Rank 1
Kumeri
Top achievements
Rank 1
Iron
Veteran
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jake
Top achievements
Rank 1
RBarnes
Top achievements
Rank 1
Iron
Iron
Rami
Top achievements
Rank 1
Iron
Veteran
Nathan
Top achievements
Rank 1
Kumeri
Top achievements
Rank 1
Iron
Veteran
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?