Panelbar children

6 posts, 0 answers
  1. david
    david avatar
    25 posts
    Member since:
    Oct 2008

    Posted 16 Sep 2012 Link to this post

    Hi guys,

    I'm working with the asp.net MVC panelbar. I have succeeded in creating the databound panelbaritems but I don't know how to create the child items.
    I have one class
    public class Item
    {
        public string Header{get;set;}
        public string Description{get;set;}
        public DateTime PostedDateTime{get;set;}
    }

    The panelbaritems contain the PostedDateTime and the Header, and now I want the child to contain the Description.

    Can you show me an example of how to do this?

    thanks
  2. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 20 Sep 2012 Link to this post

    Hi David,

    Basically when displaying child items you need a collection of objects which to display. In your case you have just a single item.
    Anyway if you want to display child items and you use the BindTo method you should use the same overload as shown here (the example is from MVC TreeView but it is the same):
    http://demos.telerik.com/aspnet-mvc/treeview/databindingtomodel 

    In your case it shoud be something like this:
    .BindTo(items,( Kendo.Mvc.UI.Fluent.NavigationBindingFactory<PanelBarItem>mappings)=>{
               mappings.For<item>(binding=>{
                   binding.ItemDataBound((pnaleBaritem, modelItem) =>
                   {
                       pnaleBaritem.Text = modelItem.Header;
                   }).Children(c=>c.Descriptions);//notice you need collection not just a single item
                    
                    binding.ItemDataBound((pnaleBaritem, modelDescription) =>
                   {
                       pnaleBaritem.Text = model.DescriptionText;
                   });
               });
           })


    All the best,
    Petur Subev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. freeTheCode
    freeTheCode avatar
    4 posts
    Member since:
    Jan 2012

    Posted 05 Feb 2013 Link to this post

    This reply doesn't even answer the question asked and simply just leaves one wondering how to get simple questions answered.

    The question is very clearly how to bind a PanelBar to a IEnumerable<someobject>, 
        1. Show someobject.property as the Panelbar header, 
        2. Show other properties of that object inside the expanded PanelBar as its Content e.g <ul> list or html with databinding to properties of someobject etc..

    The recommended answer below which is to pass a collection of Descriptions is not even in line with the question posted and frankly makes no sense. Where is the collection of Descriptions in this viewmodel class?

    public class Item
    {
    public string Header{get;set;}
    public string Description{get;set;}
    public DateTime PostedDateTime{get;set;}
    }

    This is a simple UI question that could be quickly achieved with any other framework, yet with Kendo, there is rarely good documentation or real life examples?
    So let me try to rephrase the question. How does one create a databound template for the content of the Panelbar based on the item it is bound to?
    If users are asking these basic questions, then clearly the documentation needs work, and the examples need to incorporate more real scenarios like described.
  5. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 11 Feb 2013 Link to this post

    Hello Charles,

    Basically Template could be set when creating items through the Items method.

    For example:

    .Items(panelbar =>
    {
     
                for (int i = 0; i < Model.SomeCollection.Count; i++)
                {
                    panelbar.Add().Text("My Header" + Model.SomeCollection[i].SomeProp).Content(@<text> Test template @Model.SomeCollection[i].SomeProp</text>);               
                }
    }

    I hope this helps.

    Kind Regards,
    Petur Subev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Joe
    Joe avatar
    62 posts
    Member since:
    May 2012

    Posted 01 Apr in reply to Petur Subev Link to this post

    Petur Subev said:Hi David,

    Basically when displaying child items you need a collection of objects which to display. In your case you have just a single item.
    Anyway if you want to display child items and you use the BindTo method you should use the same overload as shown here (the example is from MVC TreeView but it is the same):
    http://demos.telerik.com/aspnet-mvc/treeview/databindingtomodel 

    In your case it shoud be something like this:
    .BindTo(items,( Kendo.Mvc.UI.Fluent.NavigationBindingFactory<PanelBarItem>mappings)=>{
               mappings.For<item>(binding=>{
                   binding.ItemDataBound((pnaleBaritem, modelItem) =>
                   {
                       pnaleBaritem.Text = modelItem.Header;
                   }).Children(c=>c.Descriptions);//notice you need collection not just a single item
                    
                    binding.ItemDataBound((pnaleBaritem, modelDescription) =>
                   {
                       pnaleBaritem.Text = model.DescriptionText;
                   });
               });
           })


    All the best,
    Petur Subev
    the Telerik team
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     

     

    I am using this to dynamically populate my panel bars, and it took me a while to modify it for my own needs since it's not very well explained, but I got it working.  But I need to indent certain option in the children mapping, but creating the Text element with a bunch of &nbsp; to "indent" doesn't work.  SO I assumed I could use the Content property.  But damned if I could figure out how to populate it with dynamically generated HTML in the included binding methodology.  Could someone tell me how I can take the model.DescriptionText, make it HTML and put it in the Content for that panel item?

  7. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 06 Apr Link to this post

    Sounds like that you need a ClientTemplate?

    Regards,
    Hristo Valyavicharski
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET MVC is VS 2017 Ready