I am using the PanelBar with Items Binding. I am LoadingContent on the Expansion of a Panel. I would like to "refresh" or re load the content after a panel has been expanded, collapsed and then re-expanded. Currently, the panel does not re-load the content.
Is there a way to force the panel to be re-loaded?
Hi,
I first tried using a loop creating expansion panels which works fine on the face of it but each expansion panel needs to have a Rich Text Editor inside of it and it was not allowing me to click into the editor so I read it may be better to use a PanelBar to achieve what i need.
Basically what I need it to loop through a collection within the ViewModel and create a Panel Bar Item for each one. Each Panel Bar Item will generate 3 Rich Text Editors with Labels.
The markup shows no errors but when running I get "System.ArgumentOutOfRangeException: 'Index was out of range. Must be non-negative and less than the size of the collection. Parameter name: index'". This happens with even a single control referencing the index of the for loop e.g.:
An example of the code is:
@(Html.Kendo().PanelBar()
If I don't reference the i of the for loop within the content it works fine e.g.:
@(Html.Kendo().PanelBar()
</text>);
The reason I am using a 'for i =' loop instead of a foreach loop is because the collection was not being returned to the controller on post when I used a foreach loop but this method worked which could be down to my inexperience with MVC but I went with what worked.
The Expansion Panels worked great other than not being able to click into the Kendo().Editor() controls at all when they were inside the for loop. If I bound them to a control outside of the loop then they worked fine.
Any help would be greatly appreciated.
The background color of the Main panel item and the sub panel items. Can someone help me set the background color of the subitems to something different.
For example, when I click on Q1 Forecast I would like it be Red to give a visual indication that you have selected a sub item. Sales Forecast should remain Aqua Blue which is set from the Theme.
i am getting the error when i use @html.kendo()
it showing are you missing any directives
>please suggest any solution
Hi,
So basically I'm trying to load the items of my PanelBar at the creation of the PanelBar. My item has a LoadContentFrom itself but it only triggers once I open the panelbar item. It used to work with the LoadOnDemand property set to false but it doesn't anymore. Any idea what is I am doing wrong here?
@(Html.Kendo().PanelBar()
.Name("panelbar")
.ExpandMode(PanelBarExpandMode.Multiple)
.HtmlAttributes(new { @class = "k-primary", type = "submit", style = "width:100%" })
.LoadOnDemand(false)
.Items(panelbar =>
{
panelbar.Add().Text("Item Title").LoadContentFrom(Url.Action("Function", "Controller", Model));
}))
Thanks again!
Hi,
I would like to know how to setup a generic MVC layout(page) with a (panelbar) menu on the left (collapsable when mobile)
together with a Breadcrumb. Should be responsive / mobile first.
Actually something like your demos page navigation, but then the menu should be collapsable. Like the panelbar.
Is there a complete example for this ? Or do I have to fuzzle manually to achieve this ?
(At first I was thinking about using the menu control, but to my surprise I saw that control is not responsive.)
Martin
Hi
I saw a thread about not getting to the ID of a panelbar item in the OnSelect handler from 2012. I almost can't believe that Telerik did not yet fix this issue. But i can't find anything so i'm afraid they didn't.
It should be that easy to add to the component.
Eric
Is there a way to set a panelbar individual panel title text with a ViewBag value instead of a literal string? In my code on line 7, the text is set as "Not Submitted". But I would like to populate it with a string value I build and place in Viewbag that shows a count of records for the type of "Not Submitted". It would read like this - "Not Submitted - (20)". If it's possible, what would be the syntax to use a variable/constant instead of literal string?
01.
@(Html.Kendo().PanelBar()
02.
.Name("panelbar")
03.
.ExpandMode(PanelBarExpandMode.Single)
04.
.HtmlAttributes(new { style = "width:100%" })
05.
.Items(panelbar =>
06.
{
07.
panelbar.Add().Text("Not Submitted")
08.
.Expanded(false)
09.
}
Hi there,
I'm using kendo PanelBar with foreach for the nested contents, here is the code:
<div class="col-lg-12">
@(Html.Kendo().PanelBar()
.Name("OrganizerTour")
.ExpandMode(PanelBarExpandMode.Multiple)
.HtmlAttributes(new { style = "" })
.Items(panelbar =>
{
foreach (var result in Model)
{
panelbar.Add().Text("Organizer: " + @result.organizerName).Expanded(true)
.Items(tour =>
{
tour.Add().Expanded(true).Content(@<div class="panel-content">
<div class="row dashboard-grid">
@RenderGrid(result.Result)
</div>
</div>);
});
}
})
)
</div>
When each PanelBar is expanded, there are two arrows showing (see attached) - it's fine when collapsed.
How can I remove the bottom arrow? Or is it something wrong with the codes above?