Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > PanelBar > URGENT:Load On Demand RadPanelBar with MultiPage

• dotnetrockerzzz

  Posted on Sep 30, 2011 (permalink)

  • CASE SCENARIO : 

  I have a rad panel bar as you can see it in the code below,a MultiPage and 2 usercontrols..
  
  

  • WHAT I WANT:

  1. Whenever we click on any item in the panel , new pageview gets created from code-behind , the ID of pageview is same as value of item getting clicked, the pageview dynamically loads an usercontrol (refer C# code) 
  2. The Panel clicking also fires a javascript event in which if the pageview is already loaded it simply displays that pageview without any server-side event or postback occuring(refer javascript code)

  WHAT IS THE PROBLEM IN MY CODE? WHY AIN'T IT WORKING THE WAY IT IS EXPECTED TO ? Thanks
  
  ASPX CODE:
  

  <telerik:RadPanelBar  style="margin-left:8px;" ID="RadPanelBar1" Runat="server" Skin="Office2007"

      Width="210px" onitemclick="RadPanelBar1_ItemClick" OnClientItemClicked="onitemclick">

      <Items>

          <telerik:RadPanelItem runat="server"

              Owner="RadPanelBar1" Text="Speak & Listen.." Expanded="True">

              <Items>

                  <telerik:RadPanelItem runat="server" Owner=""

                      Selected="True" Text="Friends News Feed" Value="nfeed">

                  </telerik:RadPanelItem>

                  <telerik:RadPanelItem runat="server"

                       Owner=""

                      Text="Following Public Profiles" Value="try">

                  </telerik:RadPanelItem>

              </Items>

          </telerik:RadPanelItem>

  </telerik:RadPanelBar>
<telerik:RadMultiPage ID="RadMultiPage1" runat="server" OnPageViewCreated="RadMultiPage1_PageViewCreated">
   </telerik:RadMultiPage>

  C# CODE
  

  protected void RadMultiPage1_PageViewCreated(object sender, RadMultiPageEventArgs e)

     {

            

     }

     protected void RadPanelBar1_ItemClick(object sender, RadPanelBarEventArgs e)

     {

           

             RadPageView pager = new RadPageView();

             pager.ID = e.Item.Value.ToString();

             Control userControl = Page.LoadControl("Newsfeed/" + e.Item.Value.ToString() + ".ascx");

             userControl.ID = e.Item.Value.ToString() + "usercontrol";

             pager.Selected = true;

             pager.Controls.Add(userControl);

             RadMultiPage1.Controls.Add(pager);

     

            

     }

  
  JAVASCRIPT CODE

  function onitemclick(sender, args) {

               var multiPage = $find("<%=RadMultiPage1.ClientID%>");

               var item = args.get_item();

               var itemt = item.get_value();

               if (multiPage.get_pageViews().get_count() > 2) {

                   for (var i = 0; i < multiPage.get_pageViews().get_count(); i++) {

                       if (multiPage.get_pageViews().getPageView(i).get_id() == itemt) {

   

                           var pageView = multiPage.findPageViewByID(itemit);

                           pageView.set_Selceted(true);

                           pageView.show();

                           item.set_postBack(false);

                       }

                   }

               }

               

           }

  Reply

• dotnetrockerzzz

  Posted on Oct 1, 2011 (permalink)

  Teleik Admins can't crack this yet ?? why it is taking so much of time??
  With best hopes and regards,
  

  Reply


• Dimitar Terziev Dimitar Terziev

  Posted on Oct 4, 2011 (permalink)

  Hello Vaibhav,
  
  Try to load the user control in the OnPageViewCreated event handler function of the RadMultiPage as shown in this demo here.
  
  Greetings,
  Dimitar Terziev
  the Telerik team

  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 RadControls for ASP.NET AJAX, subscribe to their blog feed now

  Reply

• dotnetrockerzzz

  Posted on Oct 5, 2011 (permalink)

  Changed my .aspx.cs code to ..
  

  protected void RadMultiPage1_PageViewCreated(object sender, RadMultiPageEventArgs e)

    {

        Control userControl = Page.LoadControl("Newsfeed/" + e.PageView.ID.ToString() + ".ascx");

        userControl.ID = e.PageView.ID.ToString() + "usercontrol";

        e.PageView.Selected = true;

        e.PageView.Controls.Add(userControl);

        RadMultiPage1.Controls.Add(e.PageView);

    }

    protected void RadPanelBar1_ItemClick(object sender, RadPanelBarEventArgs e)

    {

        

            RadPageView pager = new RadPageView();

            pager.ID = e.Item.Value.ToString();

    }

  but still not working .. if that's what u were trying to say Mr.Dimitar Terziev is their anything else that could work??

  Reply

• Dimitar Terziev Dimitar Terziev

  Posted on Oct 6, 2011 (permalink)

  Hello Vaibhav,
  
  The reason for the experienced behavior is the fact that you should add the newly created pageview to the PageViews collection of the mutlipage in order the PageViewCreated event to be fired.
  
  First you are adding the pageview in the wrong moment , second you are not using the appropriate collection. Change your code as following:
  

  protected void RadMultiPage1_PageViewCreated(object sender, RadMultiPageEventArgs e)

    {

        Control userControl = Page.LoadControl("Newsfeed/" + e.PageView.ID.ToString() + ".ascx");

        userControl.ID = e.PageView.ID.ToString() + "usercontrol";

        e.PageView.Selected = true;

        e.PageView.Controls.Add(userControl);

         

    }

    protected void RadPanelBar1_ItemClick(object sender, RadPanelBarEventArgs e)

    {

  
  

        RadPageView pager = new RadPageView();

        pager.ID = e.Item.Value.ToString();

        RadMultiPage1.PageViews.Add(pager);

    }

  
  
  Regards,
  Dimitar Terziev
  the Telerik team

  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 RadControls for ASP.NET AJAX, subscribe to their blog feed now

  Reply

• dotnetrockerzzz

  Posted on Oct 9, 2011 (permalink)

  Respected Dimitar ,
  Apparently the JavaScript code does not work as it is expected , i have changed my code-behind code as you asked but still i am unable to achieve what i was aiming for .
  

  <script type="text/javascript">

   

          function onitemclick(sender, args) {

              var multiPage = $find("<%=RadMultiPage1.ClientID%>");

              var item = args.get_item();

              var itemt = item.get_value();

              if (multiPage.get_pageViews().get_count() > 0) {

                  for (var i = 0; i < multiPage.get_pageViews().get_count(); i++) {

                      if (multiPage.get_pageViews().getPageView(i).get_id() == itemt) {

                          var pageView = multiPage.findPageViewByID(itemit);

                          pageView.set_Selceted(true);

                          pageView.show();

                          item.set_postBack(false);

                      }

                  }

              }

   

          }

               

   

          </script>

  As given in the demo(mentioned in your above post) ,after the person clicks on the the tab second time or third time .....it loads the pageview which is already loaded in the page , i am trying to do same with the panel bar but as it does not have a property of 'PageviewID' some problem is occurring. Please go through my code and tell where i could be wrong... . The code is in <div runat="sever">//JavaScript code</div>
  
  

  Reply

• dotnetrockerzzz

  Posted on Oct 11, 2011 (permalink)

  I am using Ajax Manager could that be a problem?

  Reply

• Dimitar Terziev Dimitar Terziev

  Posted on Oct 12, 2011 (permalink)

  Hello Vaibhav,
  
  Try to disable the Ajax and check whether the problem persists. In case the problem is related to the Ajax then provide the Ajax setting that you are using.
  
  Kind regards,
  Dimitar Terziev
  the Telerik team

  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 RadControls for ASP.NET AJAX, subscribe to their blog feed now

  Reply

• dotnetrockerzzz

  Posted on Oct 16, 2011 (permalink)

  I disabled ajax but it does not work any ideas why so ???

  Reply

• dotnetrockerzzz

  Posted on Oct 23, 2011 (permalink)

  Telerik Adimns ill or what??? can't figure this out yet?? hlp needed ...

  Reply

• Dimitar Terziev Dimitar Terziev

  Posted on Oct 27, 2011 (permalink)

  Hello Vaibhav,
  
  I've prepared a sample page demonstrating how to achieve the desired functionality.
  
  All the best,
  Dimitar Terziev
  the Telerik team

  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 RadControls for ASP.NET AJAX, subscribe to their blog feed now

  Attached files

  • example.zip

  Reply

• dotnetrockerzzz

  Posted on Oct 28, 2011 (permalink)

  Thank you , sir ..
  that example worked well, thank you ...
  the only problem which needs to be corrected is ..
  

  protected void RadMultiPage1_PageViewCreated(object sender, Telerik.Web.UI.RadMultiPageEventArgs e)

     {

         Control userControl = Page.LoadControl("UserControls/" + e.PageView.ID.ToString() + ".ascx");

         userControl.ID = e.PageView.ID.ToString() + "usercontrol";

         e.PageView.Selected = true;

         e.PageView.Controls.Add(userControl);

     }

  
   Page.LoadControl("UserControls/" + e.PageView.ID.ToString() + ".ascx");
  needs to be changed to 
   Page.LoadControl(e.PageView.ID.ToString() + ".ascx");

  Thanking Telerik team for showing late but good support ..
  

  Reply

• dotnetrockerzzz

  Posted on Dec 22, 2011 (permalink)

  Going through your solution I incurred a little problem : if i click on a button twice in the usercontrol it redirects me to another usercontrol!!?? why it is so ??

  Reply

• dotnetrockerzzz

  Posted on Dec 25, 2011 (permalink)

  Somebody please help!!

  Reply

• Dimitar Terziev Dimitar Terziev

  Posted on Dec 27, 2011 (permalink)

  Hi Vaibhav,
  
  I've prepared a sample page trying to reproduce the experienced problem, but to no avail. You could find it attached.
  
  Could you provide more information for your particular implementation? Do you handle the button click event and if so what is the custom logic that you are using in the event handler function?
  
  All the best,
  Dimitar Terziev
  the Telerik team

  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 RadControls for ASP.NET AJAX, subscribe to their blog feed now

  Attached files

  • Example.zip

  Reply

• dotnetrockerzzz

  Posted on Jan 20, 2012 (permalink)

  Well , I think so i have got the solution ..
  the problem was their was a input having id as RadMultiPage1_ClientState with value="{"selectedIndex":0,"changeLog":[]}"  now whenever i used to postback ...the first time the postback used to work fine ,but the textbox/input's  value would change to null ,
  and thus the RadMultiPage would not know which Pageview is seleceted ..
  Hence, if u ajaxify the usercontrols they would work upto your expectations ...as the textbox value will not change
  thanks for your help ...
  Regards 

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > PanelBar > URGENT:Load On Demand RadPanelBar with MultiPage