RadListBox ItemTemplate with RadGrid

[Karl Rohrbach]

I am having some challenges trying to embed a RadGrid within a RadListBox.  Do I have to do a FindControl with OnItemDatabound?  Or can I do it on Page_Load()?  Any help or point me in the right direction would be greatly appreciated.

CODE BEHIND

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;

namespace PortalWeb.Partners.Communications
{
    public class Person
    {
        public int RecipientID;
        public string RecipientName;
        public string RecipientType;
        public string CompanyName;
        public string ProgramName;
        public Person(int RecipientID, string RecipientName, string RecipientType, string CompanyName, string ProgramName)
        {
            this.RecipientID = RecipientID;
            this.RecipientName = RecipientName;
            this.RecipientType = RecipientType;
            this.CompanyName = CompanyName;
            this.ProgramName = ProgramName;
        }
    }


    public partial class recipients : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void RadGrdidRecipientList_Databound(object sender, RadListBoxItemEventArgs e)
        {
            // Dummy Data //
            List<Person> MyData = new List<Person>();
            MyData.Add(new Person(1, "John Doe", "OptIn", "FrogJoy", "UIRR"));
            MyData.Add(new Person(1, "Jane Doe", "OptIn", "YouTube", "TYRR"));
            MyData.Add(new Person(1, "Jillian Doe", "OptIn", "Intel", "FREE"));
            MyData.Add(new Person(1, "Happy Joe", "OptIn", "Hello Kitty", "POLG"));
            MyData.Add(new Person(1, "Rob Crandle", "OptOut", "McDonalds", "NYTH"));

            RadGrid myFilterGrid = new RadGrid();
            myFilterGrid = e.Item.FindControl("RecipientsGrid") as RadGrid;
            myFilterGrid.DataSource = MyData;
            myFilterGrid.DataBind();
        }
    }
}

ASPX PAGE

 <telerik:RadListBox ID="RecipientFilterList" runat="server" OnItemDataBound="RadGrdidRecipientList_Databound" Width="450px" Height="300px"
            SelectionMode="Multiple" AllowTransfer="true" TransferToID="RecipientSelectList"
            AutoPostBackOnTransfer="true" AllowReorder="true" AutoPostBackOnReorder="true"
            EnableDragAndDrop="true">
            <ItemTemplate>
                <telerik:RadGrid ID="RecipientsGrid" runat="server" AllowFilteringByColumn="True"
                    GroupingSettings-CaseSensitive="false" AllowPaging="True" AllowSorting="True"
                    GridLines="Horizontal" AutoGenerateColumns="false" ShowHeader="true" PageSize="50"
                    MasterTableView-Width="100%">
                    <HeaderStyle Font-Bold="true" Font-Italic="False" Font-Overline="False" Font-Strikeout="False"
                        Font-Underline="False" ForeColor="#333333" Wrap="False" />
                    <AlternatingItemStyle BackColor="#EEEEEE" Font-Bold="False" Font-Italic="False" Font-Overline="False"
                        Font-Strikeout="False" Font-Underline="False" Wrap="True" />
                    <MasterTableView AllowFilteringByColumn="True" ItemStyle-Width="100%" NoMasterRecordsText="No Recipients Found"
                        NoDetailRecordsText="No Recipients Found" Visible="true" ShowHeadersWhenNoRecords="true">
                        <NoRecordsTemplate>
                            <div align="center">
                                No Recipients Found</div>
                        </NoRecordsTemplate>
                        <Columns>
                            <telerik:GridBoundColumn DataField="RecipientName" HeaderText="Recipients" UniqueName="RecipientName"
                                SortExpression="RecipientName" ShowSortIcon="false">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="RecipientType" HeaderText="Type" UniqueName="RecipientType"
                                SortExpression="RecipientType" ShowSortIcon="false">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="CompanyName" SortExpression="CompanyName"
                                HeaderText="Companies" UniqueName="CompanyName" ItemStyle-HorizontalAlign="left"
                                ShowSortIcon="false" HeaderStyle-HorizontalAlign="left" HeaderStyle-Wrap="false">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="ProgramName" HeaderText="Programs" UniqueName="ProgramName"
                                ShowSortIcon="false" ItemStyle-HorizontalAlign="Left" SortExpression="NumberContacts">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="RecipientID" Visible="false">
                            </telerik:GridBoundColumn>
                        </Columns>
                    </MasterTableView>
                    <ClientSettings AllowColumnsReorder="False" ReorderColumnsOnClient="False">
                    </ClientSettings>
                </telerik:RadGrid>
            </ItemTemplate>
        </telerik:RadListBox>
        <telerik:RadListBox ID="RecipientSelectList" runat="server" Width="450px" Height="300px"
            SelectionMode="Multiple" AllowReorder="true" AutoPostBackOnReorder="true" EnableDragAndDrop="true">
            <Items>
            </Items>
        </telerik:RadListBox>

 

[Peter Filipov]

Hi Karl,

Your suggestion about using FindControl() method is correct. I am sending you back your fixed code. You need to bind the control on the Page_Load event.
When you have an item template defined for RadListBox you need to have an item in it.
Here is the sample code:

Markup:

<telerik:RadListBox ID="RecipientFilterList" runat="server" OnItemDataBound="RadGrdidRecipientList_Databound"
          Width="450px" Height="300px" SelectionMode="Multiple" AllowTransfer="true" TransferToID="RecipientSelectList"
          AutoPostBackOnTransfer="true" AllowReorder="true" AutoPostBackOnReorder="true"
          EnableDragAndDrop="true">
          <ItemTemplate>
              <telerik:RadGrid ID="RecipientsGrid" runat="server" AllowFilteringByColumn="True"
                  GroupingSettings-CaseSensitive="false" AllowPaging="True" AllowSorting="True"
                  GridLines="Horizontal" AutoGenerateColumns="false" ShowHeader="true" PageSize="50"
                  MasterTableView-Width="100%">
                  <HeaderStyle Font-Bold="true" Font-Italic="False" Font-Overline="False" Font-Strikeout="False"
                      Font-Underline="False" ForeColor="#333333" Wrap="False" />
                  <AlternatingItemStyle BackColor="#EEEEEE" Font-Bold="False" Font-Italic="False" Font-Overline="False"
                      Font-Strikeout="False" Font-Underline="False" Wrap="True" />
                  <MasterTableView AllowFilteringByColumn="True" ItemStyle-Width="100%" NoMasterRecordsText="No Recipients Found"
                      NoDetailRecordsText="No Recipients Found" Visible="true" ShowHeadersWhenNoRecords="true">
                      <NoRecordsTemplate>
                          <div align="center">
                              No Recipients Found</div>
                      </NoRecordsTemplate>
                      <Columns>
                          <telerik:GridBoundColumn DataField="RecipientName" HeaderText="Recipients" UniqueName="RecipientName"
                              SortExpression="RecipientName" ShowSortIcon="false">
                          </telerik:GridBoundColumn>
                          <telerik:GridBoundColumn DataField="RecipientType" HeaderText="Type" UniqueName="RecipientType"
                              SortExpression="RecipientType" ShowSortIcon="false">
                          </telerik:GridBoundColumn>
                          <telerik:GridBoundColumn DataField="CompanyName" SortExpression="CompanyName" HeaderText="Companies"
                              UniqueName="CompanyName" ItemStyle-HorizontalAlign="left" ShowSortIcon="false"
                              HeaderStyle-HorizontalAlign="left" HeaderStyle-Wrap="false">
                          </telerik:GridBoundColumn>
                          <telerik:GridBoundColumn DataField="ProgramName" HeaderText="Programs" UniqueName="ProgramName"
                              ShowSortIcon="false" ItemStyle-HorizontalAlign="Left" SortExpression="NumberContacts">
                          </telerik:GridBoundColumn>
                          <telerik:GridBoundColumn DataField="RecipientID" Visible="false">
                          </telerik:GridBoundColumn>
                      </Columns>
                  </MasterTableView>
                  <ClientSettings AllowColumnsReorder="False" ReorderColumnsOnClient="False">
                  </ClientSettings>
              </telerik:RadGrid>
          </ItemTemplate>
          <Items>
              <telerik:RadListBoxItem Text="Item" runat="server" />
          </Items>
      </telerik:RadListBox>
      <telerik:RadListBox ID="RecipientSelectList" runat="server" Width="450px" Height="300px"
          SelectionMode="Multiple" AllowReorder="true" AutoPostBackOnReorder="true" EnableDragAndDrop="true">
          <Items>
          </Items>
      </telerik:RadListBox>

Code behind:

protected void Page_Load(object sender, EventArgs e)
   {
       RadGrid myFilterGrid;
       DataTable dataTable = new DataTable();
       DataColumn column = new DataColumn("RecipientName");
       dataTable.Columns.Add(column);
       DataRow row = dataTable.NewRow();
       row["RecipientName"] = "success";
       dataTable.Rows.Add(row);

       myFilterGrid = RecipientFilterList.Items[0].FindControl("RecipientsGrid") as RadGrid;
       myFilterGrid.DataSource = dataTable;
       myFilterGrid.DataBind();
   }

Kind regards,
Peter Filipov
the Telerik team

[Mangesh]

Hi,

What if we want to implement Radgrid's events such as itemdatabound or itemcreated inside RadlistBox, How do we call it? It's there any way we can achieve this?

Regards

[Princy]

Hi Mangesh,

You can achieve this using two ways.

1)You can directly attach the RadGrid events from the designer page as shown below.
    a)Click on the RadListBox Smart tag
    b)select Edit Templates
    c)select the RadGrid Smart tag
    d)click on the properties and attach respective events.

2)You can access the RadGrid inside RadListBox and attach the events dynamically as shown below.

C#:

protected void Page_Load(object sender, EventArgs e)
  {
     RadGrid grid = (RadGrid)RadListBox1.Items[0].FindControl("RadGrid1");
     grid.ItemDataBound += new GridItemEventHandler(grid_ItemDataBound);
     grid.ItemCreated += new GridItemEventHandler(grid_ItemCreated);
  }
void grid_ItemCreated(object sender, GridItemEventArgs e)
  {
     //Your code
  }
void grid_ItemDataBound(object sender, GridItemEventArgs e)
  {
     //Your code
  }

Hope this helps.

Thanks,
Princy.