Forums Ultimate UI for ASP.NET Web Forms
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
meher
65
Indentation is not happening in Webexplorer bar control.
posted

Hello,

I have a problem with multi level nodes in web explorer bar control. We are unable to differentiate between the parent node , child and its child node.  we are not able to achieve definite indentation at each level in the hierarchical menu. I have inserted some images and code snippet to get a feel of the issue.

In this image configuration has 3 child nodes in which indentation is not apparent. Similarly Configuration --> Facilities  has 6 child nodes and in which indentation is happening. Recommend some thing to change the image of the parent,child and its child nodes.

Code snippet:

  <ig:WebExplorerBar ID="webMenu" Width="198px" runat="server" EnableExpandButtons="true"
                                EnableAjaxViewState="true">
                                <ClientEvents Initialize="ImageClick" />
                                <AutoPostBackFlags ItemClick="Off" />
                                <DataBindings>
                                    <ig:ExplorerBarItemBinding DataMember="dtView" TextField="ModuleName" ValueField="Id"
                                        NavigateUrlField="Executable" TargetField="Target" />
                                  
                                </DataBindings>
                            </ig:WebExplorerBar>
                            <ig:WebHierarchicalDataSource ID="wHDS" runat="server">
                                <DataRelations>
                                    <ig:DataRelation ChildDataViewID="dtView" ParentDataViewID="dtView" ChildColumns="ParentModuleCode"
                                        ParentColumns="ModuleCode" />
                                </DataRelations>
                                <DataViews>
                                    <ig:DataView ID="dtView" />
                                </DataViews>
                            </ig:WebHierarchicalDataSource>.

 

Parents
No Data
Reply
  • 49378
    posted

    Hi mehboob18,

    It has been some time since your post, however in case you still need assistance I would be glad to help.

    The indentation for child items is actually happenning, however it is applying only to the text of the item (not the image displayed for parent items). You can choose not to display that image by modifying the igeb_ItemParent CSS class located in the ig_explorerbar.css file.

    Another approach would be to handle the ItemExpanding client-side event of your ExplorerBar and access the child elements of the expanded item. There you could set a marginLeft value for these elements to "indent" them.

    Please feel free to contact me if you have any questions.

Children
No Data