I am attempting to upgrade an UltraWebListbar to the WebExplorerBar. Basically, this UltraWebListBar resides on the left side of the browser window, with height at 100%. Each group contains a Template which contains other html. This is used for selecting criteria for a report.
The UltraWebListBar honors the Height attribute, and is always sized to 100%. The groups are stacked at the very top and very bottom of the page, with the selected group's content using all of the remaining available height. It doesn't matter what the size of the actual content is, it honors the height, and displays scrollbars on the content as necessary.
For the life of me, I can't get the WebExplorerBar to behave the same way. It seems to ignore the Height property altogether, and instead sizes itself vertically based on the content size. Even with the height at 100%, the bottom group is half-way up the page, and the selected group is tightly compressed. If I select a group that contains an item with a lot of content, it forces the bottom groups down below the bottom of the page so you have to scroll to see them. I can't specify a item heights, because I can't predict what the browser size will be. Besides, the item height ought to be irrelevant. I can put a div in the template and use overflow to display scrollbars if necessary.
I really could use some guidance here. How can I get the WebExplorerBar to honor its Height property, when it is set to 100%?
I am running 12.2,20122.2075 of the Infragistics4.Web.v12.2.dll, however I am stuck on version 11.1.20111.2238 of the Misc and Shared libraries until I finish upgrading the legacy controls. I don't know which library the WebExplorerBar is in.
Nikifor, your code definitely set me on the right path.
After some thought, I decided that a WebDataTree is a better user interface for multiple selection than a multi-select listbox. Of course the code that you provided didn't work with the data tree so I had to do some tweaking...
My latest code calculates the height of all of the group bars, and then adjusts the height of the ul.igeb_IGGroupContents and div.igeb_IGItem elements. The end result did works, and it is more flexible because it can support a wider range of HTML content. I am glad to share the code if you would find it useful.
Now I have a completely different problem. I am having trouble wiring up the WebDataTrees that are in the item templates. Just getting a reference to the control in codebehind is a pain in the butt. If the page posts back, the controls lose their viewstate, and so on. Also, the WebDataTrees need to fire their own postback event when the node is checked. I have made a jumbled mess trying to get it all to work right.
With the UltraWebListBar, this was very easy. Controls placed in the item template could be referenced from ASP.Net as if they were placed on the page itself. Events wired up without a hassle. Not so with the WebExplorerBar. It looks like I have to manually wire up each child control.
So, here are my two questions:
Assuming that you have a WebExplorerItem that has a template that contains a single WebDataTree, what is the correct way to wire it up so that the WebDataTree fires events and maintains and viewstate across postbacks (which may initiate from either the WebDataTree itself or outside the template)?
As a second question, what is the correct event to use for populating the nodes into the WebDataTree in the first place, so that it doesn't interfere with viewstate changes on postback?
Hello Rob,Please update me with any progress which you have with this scenario.
Nikifor, thank you very much! I understand what you are doing here, and I believe this will resolve the issue. I will give it a try this afternoon.
-Rob
Hello Rob,I am attaching a sample on which I was working. Basically this cannot be achieved with just setting properties because the html construction is a lot more diferent in the explorer bar. You will have to manually carry for the item which is currently expanded and its height. In the sample the "magic" number 129 is 43 pixels height of collapsed group muptiplied by 3 collapsed groups (one expanded from 4 total). You have to handle 3 events - initialize of the control. resizing of the browser and expanding of a new group.
The attached sample demonstrates a working prototype using the WebListBar. A few notes:
*The WebListBar didn't work with the Lorum Ipsum text either. I replaced that with my actual usage, which is listboxes sized at 100%.
*There is code in the .vb file that populates the listboxes that should be pretty easy to port over to C#.
*My current page is displaying in IE 10 Quirks mode, not Standards. As part of putting together the prototype, I discovered that the WebListBar doesn't work the way I need it to in Standards mode. Part of the goal of the project is to try to get the page to render correctly in Standards mode. This prototype works properly when displayed in IE10 Quirks. I modified the <html> tag to force quirks, so you can see the desired behavior.
*I also included a screenshot of the desired behavior, in case you have difficulty reproducing it.