I am unable to set the css class properties for group items using server side events. The code works fine for non-group items. Attached is a sample application. The sample demonstrates the issue. The code also saves and restores the expanded/selected state of the WebExplorerBar items across page navigation. The code that sets the styles attempts to set the style for the tree item that was selected (this works fine as long as it is not a group item) and also set the style of the group item if it is either the selected item or a sub-item of the group is selected. If you inspect the markup that is generated you can see that the group items retain their default css style setting while regular items are set to their new styles.
Any help would be appreciated (sample app is attached).
Thanks.........
Hello,
Thank you for the code attachment.
After investigating this matter for you, I suggest you to set the igeb_ prefix for the CSS classes applied, thus you will be using another set of inbuild css classes. For example make the following changes where required:
//group.ActiveCssClass = "webs_GroupActive"; //group.CssClass = "webs_Group"; //group.DisabledCssClass = "webs_GroupDisabled"; //group.HoverCssClass = "webs_GroupHover"; //group.SelectedCssClass = "webs_GroupSelected";
group.ActiveCssClass = "igeb_GroupActive"; group.CssClass = "igeb_Group"; group.DisabledCssClass = "igeb_GroupDisabled"; group.HoverCssClass = "igeb_GroupHover"; group.SelectedCssClass = "igeb_GroupSelected";
What is more, I am reattaching a modified sample including a regular WebExplorerBar for comparison. I have updated the default css (ig_explorerbar.css) file used by the control adding some funky background colors for some of the classes involved, in order to better illustrate which is applied where/when.
I expect this will help you get on tracks.
Thanks for your reply. This is the opposite of what I am trying to achieve. I am trying to set the css classes to something other than the built in css class. The group nodes are stuck on the built in (igeb_....) css class even though I am setting them to a different class. The non-group nodes are not stuck and the new style is applied correctly. Please let me know what I am doing wrong. Thanks
Thanks for the clarification.Well, in case you are going to use the same styling across the application, you could prefer to just modify the existing inbuilt styles, classes etc. instead of maintaining more css. This will ensure minimum development required. What is more, you may find the AppStylist Tool (installed with the product) help you easily modify the ASP.NET controls. https://www.youtube.com/watch?v=MSw9uXUoxDM&feature=youtu.be&t=500
In case you would like to set different styles for the menu/WebExplorerBar based on the current page/condition, maybe you will find the following helping you. The first one has a valid approach illustrated in the response attachment where the styles are applied on group by group basis.
https://www.infragistics.com/community/forums/f/ultimate-ui-for-asp-net/92679/css-styles
https://www.infragistics.com/community/forums/f/ultimate-ui-for-asp-net/50638/web-explorer-bar-group-css
https://www.infragistics.com/community/forums/f/ultimate-ui-for-asp-net/57925/how-do-i-set-the-css-class-when-binding-to-an-xml-datasource
Let me know how the above approach works for you.
Thanks for your reply. I need to set the styles of the groups and items in the code behind, it is a requirement (I realize the test app is not perfect, it just demonstrates the issue).
I tried the solutions in the 3 links (the databinding post doesn't apply since I am not calling DataBind()) and I get the same result......I am able to set the item css class properties, but group css properties revert back to the default styles (please look at the markup that is generated and you can see this). I can step through the code and see that the group sytles are being set, but then are reverted back somehow when the html is generated.
To simplify things I took my application and removed all functionality, but I call this code in all page and control events that make sense (init, load, prerender, etc....):
webNavigation.Groups[0].ActiveCssClass = "webs_GroupActive"; webNavigation.Groups[0].CssClass = "webs_Group"; webNavigation.Groups[0].DisabledCssClass = "webs_GroupDisabled"; webNavigation.Groups[0].HoverCssClass = "webs_GroupHover"; webNavigation.Groups[0].SelectedCssClass = "webs_GroupSelected";
and the group css still reverts back to the base style. It looks like it just does not work with the version of controls that I am using (14.1.20141.2150). I have also tried version 14.2.20142.2480 and get the same results (group css properties are not set-able from code behind).
Hello, I have investigated this issue and I have asked our engineering staff to examine this further. To ensure that it will receive attention, I have logged this behavior in our internal tracking system with a Development ID of #207882: “WebExplorerBar custom Group styles are not applied when passing custom styles either from code behind OR from the Markup”. The next step will be for a developer to review my investigation and confirm my findings or to offer a fix, or other resolution. I will leave this case open and update you with this information after the review. You can also continue to send updates to this case at any time. You can view the status of all development issues connected to this case from the "Development Issues" tab, when viewing this case on the "My Support Requests" page of our website. You will automatically receive updates for the progress of it and when a fix is available.