Adding CheckBoxes dynamically

[Thomas]

Dear All,

I´m pretty new to Telrik controls and have the following question.

I´m using a RadPanelBar to be able to let the user push the RadPanelBar and display 1-n activities presented as checkBoxes (I need to add these dynamically as I do not know how many acitivities there might be). The checkboxes should be presented as subItems and with that I mean that I want the user to push the RadPanelBar and the different activities/checkboxes should slide open/out. My idea is to grab the CheckBox2 in the RadPanelBar and add the actitivities to it. 

For achiving this I use the follwing code in my .ascx file:

 <telerik:RadPanelBar ID="RadPanelBar1" runat="server"> 
        <Items> 
            <telerik:RadPanelItem runat="server" Text="Activities"> 
                <Items> 
                    <telerik:RadPanelItem runat="server" Value="templateHolder"> 
                        <ItemTemplate> 
                            <asp:CheckBox ID="CheckBox2" runat="server" /> 
                        </ItemTemplate> 
                    </telerik:RadPanelItem> 
                </Items> 
            </telerik:RadPanelItem> 
        </Items>  
 </telerik:RadPanelBar>

This is my  .ascx.cs file:

public override void DoLayout( )
  {
     //Get collection
     TrackableCollection<ProjectActivityBooking> acitivities = existingRegistration.ProjectParticipant.ProjectEntity.ProjectActivityBooking;
     //Here it is possible to get hold of the checkbox
     CheckBox cb = RadPanelBar1.FindItemByValue("templateHolder").FindControl("CheckBox2") as CheckBox;
     //Add datasource and bind
     this.RadPanelBar1.ItemDataBound += new RadPanelBarEventHandler(itemDatabound);
     this.RadPanelBar1.DataSource = acitivities;
     this.RadPanelBar1.DataBind();
  }

The code below let me add a new instatited CheckBox, but it is not added as subitem. Instead I´m getting a "static" RadPanelBar without the nice feature of being pushed and sliding out the subitems ie. activities

void itemDatabound(Object sender, RadPanelBarEventArgs e)
  {
     //Get panelItem
     RadPanelItem item = (RadPanelItem)e.Item;
     //Create Checkbox
     CheckBox chk = new CheckBox();
     //Get Activity
     ProjectActivityBooking activity =  item.DataItem as ProjectActivityBooking;
     //Set activity name
     chk.Text = activity.ProjectActivity.ActivityName;
     //Add control
     item.Controls.Add(chk);
   }

I think the way forward is something like below, but that will not get me my CheckBox.
void itemDatabound(Object sender, RadPanelBarEventArgs e)
{
   //This will throw an exception
   //CheckBox cb1 = RadPanelBar1.FindItemByValue("templateHolder").FindControl("CheckBox2") as CheckBox;
   //This will return null as it will now find the templateHolder RadPanel item
   //How will I then get hold of the CheckBox2 when the templateholder do not find/returns null
   //RadPanelItem item = e.Item.FindControl("templateHolder") as RadPanelItem;
}

Please let me know what I´ve done wrong?

Best Regards,

Thomas Andersson

[Simon]

Hello Thomas,

I suggest you use the ContentTemplate in your case - it will better suite your requirements. Please see this demo for more information.

All the best,
Simon
the Telerik team

[Thomas]

Hi,

And thanks for your reply. I will have a go at it this afternoon.

Best Regards,

Thomas Andersson

[Thomas]

Hi,

Did not have the time to test your solution before christmas. However I´m now having the problem with that each subitem has a header (see the attach .png) I want only one heading and all subitem (ie. textbox and lable) should be added under this.

Here is my aspx code:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="PaymentPage.ascx.cs" Inherits="CX.Aranea.Client.WebFront.UserControls.RegistrationForm.Payment.PaymentPage" %>
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
<%@ Register Src="~/UserControls/CxStandardControls/CxLabel.ascx" TagPrefix="cx" TagName="Label" %>
 <telerik:RadPanelBar runat="server" ID="RadPanelBar1" Width="400px" Height="30px"
        Skin="Forest" ExpandMode="MultipleExpandedItems" ExpandAnimation-Type="InElastic"  >
        <Items>
           <telerik:RadPanelItem Text="root" Expanded="false">
                <ContentTemplate>

                </ContentTemplate>
            </telerik:RadPanelItem>
      </Items>
   /telerik:RadPanelBar>
 <br />
 <br />
<cx:Label ID="lblCaption" runat="server" />
 <asp:PlaceHolder ID="plhChildren" runat="server"/>
 <asp:Label ID="lblTotalBooked" runat="server"/>

<script type="text/javascript">

 }

</script>

Here are my aspx.cs code:

public override void DoLayout(Aranea.Common.EntityDOL.ProjectRegistration existingRegistration)
  {
   base.DoLayout(existingRegistration);
   lblCaption.Text = "Payment page";
   
   //Get collection
   TrackableCollection<ProjectActivityBooking> acitivities = existingRegistration.ProjectParticipant.ProjectEntity.ProjectActivityBooking;

   //Add datasource and bind
   this.RadPanelBar1.ItemDataBound += new RadPanelBarEventHandler(itemDatabound);
   this.RadPanelBar1.DataSource = acitivities;
 
   
   this.RadPanelBar1.DataBind();

   this.lblTotalBooked.Text = "Total Booked " + decimal.Round(totalBooked, 2).ToString();
  }

  void itemDatabound(Object sender, RadPanelBarEventArgs e)
  {
decimal totalActivityPrice = 0;

   //Get panelItem
   RadPanelItem item = (RadPanelItem)e.Item;

   //Create Checkbox
   CheckBox chk = new CheckBox();

   //create label
   Label lbl = new Label();
   
 //Get Activity
   ProjectActivityBooking activity =  item.DataItem as ProjectActivityBooking;
   
   //Get total activity price
   totalActivityPrice = GetActivityPrice(activity);
  
 //Get total booked
   totalBooked += totalActivityPrice;
   lbl.Text = totalActivityPrice.ToString();
  
 //Set activity name
   chk.Text = activity.ProjectActivity.ActivityName;
   chk.TextAlign = TextAlign.Left;
  //Add controls
   item.Controls.Add(chk);
   
  }

Could you please advice me as I´m at the moment are a bit clueless and the deadline is closing in :):

Best regards,

Thomas Andersson

[Simon]

Hi Thomas,

Could you please elaborate more on your requirement as the screenshot and code did not give me enough details? What is the problem in the current setup?

All the best,
Simon
the Telerik team