I have a webgrid that, when initially loaded, looks exactly like I want it to. We have the grid set up so that if you click on a cell, a popup appears (the popup is essentially just a floating div - made visible & populated by a callback). Before clicking on a cell, the grid looks fine. After clicking on a cell then closing the popup, the style applied to the row expansion area is the same as the style applied to the header row which we do not want - I confirmed this by changing the border colours of the header row to black (they're currently white) and confirmed that after the callback, the border on the row expansion area also changed to black (when it should have been light blue).
I have attached screenshots of what it looks like before the callback as well as after. As you can see, after the callback, it does not look right.
Here are the 2 styles in question, being used by my grid:.GridTableHeaderRow{ background-color: #87BCE8; color: white; font-size: 8pt; font-weight: bold; border-color: #87BCE8 #FFFFFF #87BCE8 #87BCE8; border-style: solid; border-width: 1px; height: 55px;}.GridRowExpArea{ border: 1px solid #87BCE8;}
Here is the markup for the grid: <igtbl:UltraWebGrid ID="ManagerGrid" runat="server" Width="100%" EnableViewState="false"> <Bands> <igtbl:UltraGridBand> <AddNewRow View="NotSet" Visible="NotSet"> </AddNewRow> </igtbl:UltraGridBand> <igtbl:UltraGridBand> <AddNewRow View="NotSet" Visible="NotSet"> </AddNewRow> </igtbl:UltraGridBand> <igtbl:UltraGridBand> <AddNewRow View="NotSet" Visible="NotSet"> </AddNewRow> </igtbl:UltraGridBand> </Bands> <DisplayLayout BorderCollapseDefault="Separate" Name="ctl00xManagerGrid" RowHeightDefault="26px" Version="4.00" ViewType="Hierarchical" CellClickActionDefault="NotSet" IndentationDefault="20" HeaderClickActionDefault="SortSingle" RowSelectorsDefault="No" TableLayout="Fixed" LoadOnDemand="NotSet" StationaryMargins="Header" AutoGenerateColumns="false" AllowSortingDefault="OnClient" UseFixedHeaders="true" OptimizeCSSClassNamesOutput="False" AllowAddNewDefault="No"> <FrameStyle CssClass="TableFrame" Width="100%"> </FrameStyle> <Pager> <PagerStyle BackColor="LightGray" BorderStyle="Solid" BorderWidth="1px"> <BorderDetails ColorLeft="White" ColorTop="White" /> </PagerStyle> </Pager> <EditCellStyleDefault BorderStyle="None" BorderWidth="0px"> </EditCellStyleDefault> <HeaderStyleDefault CssClass="GridTableHeaderRow" Wrap="true" Font-Bold="true" Height="55px"> </HeaderStyleDefault> <RowStyleDefault CssClass="GridTableRow" BorderWidth="1px" Wrap="false"> <Padding Left="3px" /> </RowStyleDefault> <Images> <SortAscendingImage Url="~/Images/sortascwhite.gif" /> <SortDescendingImage Url="~/Images/sortdescwhite.gif" /> </Images> <RowExpAreaStyleDefault CssClass="GridRowExpArea"> </RowExpAreaStyleDefault> <ActivationObject BorderColor="" BorderWidth="" AllowActivation="False"> </ActivationObject> </DisplayLayout> </igtbl:UltraWebGrid>
I couldn't figure out how to upload more than one attachment. So here's the screenshot of what it looks like after the callback.