[Solved] SelectedUrl, SelectedValue

[Mattias]

Hi,
How can I set selected item when the items url is not present?

The issue is about categories and products. Each category has X number of products.
Now, the panelbar shows the categories.
But when I browse to a product I want to show the panelbar on the left side.
So the only thing I have is the ID from the category which I get from the product.

The only thing available is SelectedIndex for the panelbar but I don't know this value.

Maybe there is a simple way to solve this but otherwise a nice feature would be a property called SelectedUrl or something and this could match an items url property.

Regards,
Mattias

[Mattias]

I have been able to add the property Selected to my items now, like:

.BindTo(Model, mappings =>
        {
            mappings.For<ArticleGroupEditViewModel>(binding => binding
                    .ItemDataBound((item, group) =>
                    {
                        item.Text = group.Text;
                        item.Url = group.Url;
                        item.Selected = group.Selected;
                    })
                    .Children(group => group.Childs));
            mappings.For<ArticleGroupEditViewModel>(binding => binding
                    .ItemDataBound((item, group) =>
                    {
                        item.Text = group.Text;
                        item.Url = group.Url;
                        item.Selected = group.Selected;
                    }));
        })

And if I check the html, I've got the correct css class for one (the selected one) item: <li class="t-item"><a class="t-link t-state-selected" ...
But my previously working onload function is not working anymore:

function ExpandSubItems(e) {
     var panelBar = $(this).data("tPanelBar");
     var selectedlink = $("li.t-item a.t-state-selected", this);
     var li = selectedlink.parent();
     panelBar.expand(li);
}

I've got an [object] for the li-element but the last line: panelBar.expand(li); is not expanding it. Why?
Any ideas?

/Mattias

[Kamen Bundev]

Hello Mattias,

My guess is that jQuery is selecting several elements and you are trying to expand the wrong one, but I can't say for sure if that is happening without checking a live URL. You can open a support ticket and submit one, so I can verify. Other than that you can try to limit the jQuery selection to the root items, like this:

window.onload = function () {
    var panelElement = $("#PanelBar"), // Insert your PanelBar ID here.
        panelBar = panelElement.data("tPanelBar"),
        selectedlink = $(" > li.t-item > .t-state-selected", panelElement),
        li = selectedlink.parent();
 
    panelBar.expand(li);
};

Thanks for SelectedUrl suggestion, we will think about if its implementation is viable for future releases.

Best wishes,
Kamen Bundev
the Telerik team