iSeller Commerce
iSeller POS Retail
iSeller POS F&B
iSeller POS Express
Crosslight
WebUI
ClientUI
What's New
Download Trial
Web Solution
Mobile Solution
Enterprise Solution
Custom Development
Blog
Community
Latest Development Blogs
ForumPostTopic
Browse By Tag
I hreby attached an example that shows the webgrid inside a tab control, that grows in height everytime, when we click the button in tab 2 and comes back to tab 1.
Steps to create the issue
1. Check the height of the webgrid in tab 1.
2. go to tab 2 and click the button. this makes a page postback.
3. come to tab 1 and check the webgrid height.
4. ensure the height will change once we click the refresh image in webgrid.
the standard height has been defined in the webgrid.
Still why it is growing heightwise, if we click the button in tab 2?
Please give a solution.
I could not attach the project. so I have given the code and the xml file below.
<ISWebDesktop:WebTab ID="WebTab1" runat="server" Height="343px" Width="680px"> <TabPages> <ISWebDesktop:WebTabItem Text="Tab 1"> <PageTemplate> <ISWebGrid:WebGrid ID="dgSegments" runat="server" Height="200px" Width="500px" DefaultStyleMode="Win7" DataSourceID="XmlDataSource2"> <LayoutSettings AllowExport="Yes" AllowFilter="Yes" GridLineColor="236, 233, 216" RowHeaders="No" AutoFilterSuggestion="true" ShowFilterStatus="true" PagingExportMode="ExportAllData" AllowSorting="Yes" RowHeightDefault="-1px"> <FrameStyle BackColor="White" BorderColor="#FFE0C0" BorderStyle="Solid" BorderWidth="1px" Height="200px" Width="500px"> </FrameStyle> <AlternatingRowStyle BackColor="#ffe0d9" CustomRules="text-overflow: ellipsis; overflow-x: hidden" Font-Names="Verdana" Font-Size="8pt" /> <FocusCellStyle BorderColor="Navy" BorderStyle="Solid" BorderWidth="1px" /> <RowStyle BackColor="White" CustomRules="text-overflow: ellipsis; overflow-x: hidden ; overflow-y: hidden" Font-Names="Verdana" Font-Size="8pt" /> <SelectedRowStyle BackColor="LightSteelBlue" /> <HeaderStyle BackColor="#D32730" BorderColor="#CC9966" BorderWidth="1px" Font-Names="Verdana" Font-Size="8pt" ForeColor="White" Font-Bold="true" Height="20px" Wrap="False" CustomRules="border-right: solid 1px #F8EDD7; border-bottom: solid 1px #F8EDD7" /> <FooterStyle BackColor="#D32730" ForeColor="white" /> <NewRowStyle BackColor="White" Font-Names="Verdana" Font-Size="8pt" ForeColor="DarkGray"> </NewRowStyle> <StatusBarStyle BackColor="#ffe0d9" BorderColor="#D32730" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" Font-Size="8pt" ForeColor="Black"> <Padding Bottom="1px" Left="1px" Right="1px" Top="1px" /> </StatusBarStyle> <StatusBarCommandStyle> <Normal> <Padding Bottom="1px" Left="1px" Right="1px" Top="1px" /> </Normal> <Over BackColor="CornflowerBlue" BorderColor="Navy" BorderStyle="Solid" BorderWidth="1px"> </Over> <Active BackColor="RoyalBlue" BaseStyle="Over"> </Active> </StatusBarCommandStyle> <EditTextboxStyle BorderStyle="None" BorderWidth="0px" Font-Names="Verdana" Font-Size="8pt"> </EditTextboxStyle> </LayoutSettings> <RootTable Caption="SegmentDetails" DataKeyField="name"> <Columns> <ISWebGrid:WebGridColumn Caption="Name" DataMember="name" FilterEditType="TextBox" EditType="NoEdit" Name="isdSegment" Width="150px" AllowMultiLine="True"> </ISWebGrid:WebGridColumn> <ISWebGrid:WebGridColumn Caption="Description" DataMember="description" FilterEditType="TextBox" EditType="NoEdit" Name="isdDescriptionr" Width="200px" AllowMultiLine="True"> </ISWebGrid:WebGridColumn> </Columns> </RootTable> </ISWebGrid:WebGrid> <asp:XmlDataSource ID="XmlDataSource2" runat="server" DataFile="~/Company.xml"> </asp:XmlDataSource> </PageTemplate> </ISWebDesktop:WebTabItem> <ISWebDesktop:WebTabItem Name="tab2" Text="tab2"> <PageTemplate> <asp:Button ID="Button2" runat="server" Text="Button" /> </PageTemplate> </ISWebDesktop:WebTabItem> </TabPages> <FrameStyle Overflow="Hidden" OverflowY="Hidden" OverflowX="Hidden"></FrameStyle> <TabItemStyle> <Normal Cursor="Hand" BackColor="Gainsboro" BorderColor="Gray" BorderStyle="Solid" BorderWidth="1px" Font-Bold="False" Font-Italic="False" Font-Names="Tahoma" Font-Size="8pt" Font-Underline="False" Height="100%" Width="100%"> <Padding Top="2px" Left="10px" Right="10px" Bottom="0px"></Padding> </Normal> <Over BaseStyle="Normal" BackColor="WhiteSmoke"></Over> <Active GradientType="Vertical" BackColor2="245, 245, 245" BaseStyle="Normal" BackColor="White" BorderColor="Navy" BorderStyle="Solid" BorderWidth="1px"></Active> </TabItemStyle> <ContainerStyle Overflow="Auto" OverflowY="Auto" OverflowX="Auto" BackColor="WhiteSmoke" BorderColor="Navy" BorderStyle="Solid" BorderWidth="1px" Height="100%" Width="100%"> <Padding Top="5px" Left="5px" Right="5px" Bottom="5px"></Padding> </ContainerStyle> <RoundCornerSettings TopBorderColor="230, 139, 44" FillerBorderColor="255, 199, 60"></RoundCornerSettings> <DisabledStyle ForeColor="Gray"></DisabledStyle> </ISWebDesktop:WebTab>
I have the xml file like this.
MMI
</CompanyCode><
SRC
MMIM
</CompanyCode></Company>
</Company>
Hello Dilshad,
I could replicate your issue on my end. Actually, it is not caused by the PostBack. The issue happens when you navigate to tab2 then tab1. WebGrid is not set into your current size. To avoid WebGrid resize inside WebTab, you can add the following code at OnAfterTabChanged event on WebTab clientSideEvent property:
wgDoResize(true, true);
This code will set your WebGrid into your current size as like as you've set.
Hope this helps.Riendy
thanks for your help.
this is working.
My grid is not resizing after adding the client side event for tab.
Hi Dilshad,
Glad to hear that.please do not hesitate to ask us if you have any question later. Have a nice day.
Best regards.Riendy
Could I get some help of the same type in web navigation pane.
I'm using the webgrid in web navigation pane and i'm getting the same issue.
I tried using the "wgDoResize(true, true);" inside onbarclicked event, but it is not working.
is there anyway we can use this script in web nav pane to restrict the webgrid from resizing every time if i change the pane?
Unfortunately, I was unable to replicate the issue. I Tried to use a WebGrid on WebNavPane, but it works well on my end. Is it possible for you to attach a simple sample which replicate this issue ? Actually, you can use the same way to avoid the resizing. I think onBarClicked event is too fast to excute wgDoResize method. You can try to set time out for your method using this code :
window.setTimeout(function () { wgDoResize(true, true); }, 300);
Regards.Riendy
HI Riendy,
Unfortunately the timeout is not working properly inside the onbarclick method. it is giving out some javascript error.
I hereby added the code i use which simulate the issue of resizing teh grid inside webpane.
please have a look on this.
Awaiting for your reply as this need to into production by a week.
You can use the same xml file used in earlier posts.
<ISWebDesktop:WebTab ID="WebTab1" runat="server" Height="700px" Width="700px"> <TabPages> <ISWebDesktop:WebTabItem Text="Tab 1"> </ISWebDesktop:WebTabItem> <ISWebDesktop:WebTabItem Text="Tab 2"> <PageTemplate> <ISWebDesktop:WebNavPane ID="WebNavPane1" runat="server" Height="500px" Width="630px"> <GripStyle> <Normal Overflow="Hidden" GradientType="Vertical" BackColor2="Gray" BackColor="LightGray"></Normal> <Over BaseStyle="Normal"></Over> <Active BackColor2="Black" BaseStyle="Normal" BackColor="Gray"></Active> </GripStyle> <Bars> <ISWebDesktop:WebNavBar Name="navbar_bar1" Text="bar1" ContentMode="UseInlineContent"> <ContentTemplate> <asp:Button ID="Button1" runat="server" Text="Button" /> </ContentTemplate> </ISWebDesktop:WebNavBar> <ISWebDesktop:WebNavBar Name="navbar_bar2" Text="bar2" ContentMode="UseInlineContent"> <ContentTemplate> <ISWebGrid:WebGrid ID="dgSegments" runat="server" Height="200px" Width="500px" DefaultStyleMode="Win7" DataSourceID="XmlDataSource2"> <LayoutSettings AllowExport="Yes" AllowFilter="Yes" GridLineColor="236, 233, 216" RowHeaders="No" AutoFilterSuggestion="true" ShowFilterStatus="true" PagingExportMode="ExportAllData" AllowSorting="Yes" RowHeightDefault="-1px"> <FrameStyle BackColor="White" BorderColor="#FFE0C0" BorderStyle="Solid" BorderWidth="1px" Height="200px" Width="500px"> </FrameStyle> <AlternatingRowStyle BackColor="#ffe0d9" CustomRules="text-overflow: ellipsis; overflow-x: hidden" Font-Names="Verdana" Font-Size="8pt" /> <FocusCellStyle BorderColor="Navy" BorderStyle="Solid" BorderWidth="1px" /> <RowStyle BackColor="White" CustomRules="text-overflow: ellipsis; overflow-x: hidden ; overflow-y: hidden" Font-Names="Verdana" Font-Size="8pt" /> <SelectedRowStyle BackColor="LightSteelBlue" /> <HeaderStyle BackColor="#D32730" BorderColor="#CC9966" BorderWidth="1px" Font-Names="Verdana" Font-Size="8pt" ForeColor="White" Font-Bold="true" Height="20px" Wrap="False" CustomRules="border-right: solid 1px #F8EDD7; border-bottom: solid 1px #F8EDD7" /> <FooterStyle BackColor="#D32730" ForeColor="white" /> <NewRowStyle BackColor="White" Font-Names="Verdana" Font-Size="8pt" ForeColor="DarkGray"> </NewRowStyle> <StatusBarStyle BackColor="#ffe0d9" BorderColor="#D32730" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" Font-Size="8pt" ForeColor="Black"> <Padding Bottom="1px" Left="1px" Right="1px" Top="1px" /> </StatusBarStyle> <StatusBarCommandStyle> <Normal> <Padding Bottom="1px" Left="1px" Right="1px" Top="1px" /> </Normal> <Over BackColor="CornflowerBlue" BorderColor="Navy" BorderStyle="Solid" BorderWidth="1px"> </Over> <Active BackColor="RoyalBlue" BaseStyle="Over"> </Active> </StatusBarCommandStyle> <EditTextboxStyle BorderStyle="None" BorderWidth="0px" Font-Names="Verdana" Font-Size="8pt"> </EditTextboxStyle> </LayoutSettings> <RootTable Caption="SegmentDetails" DataKeyField="name"> <Columns> <ISWebGrid:WebGridColumn Caption="Name" DataMember="name" FilterEditType="TextBox" EditType="NoEdit" Name="isdSegment" Width="150px" AllowMultiLine="True"> </ISWebGrid:WebGridColumn> <ISWebGrid:WebGridColumn Caption="Description" DataMember="description" FilterEditType="TextBox" EditType="NoEdit" Name="isdDescriptionr" Width="200px" AllowMultiLine="True"> </ISWebGrid:WebGridColumn> </Columns> </RootTable> </ISWebGrid:WebGrid> <asp:XmlDataSource ID="XmlDataSource2" runat="server" DataFile="~/Company.xml"> </asp:XmlDataSource> </ContentTemplate> </ISWebDesktop:WebNavBar> <ISWebDesktop:WebNavBar Name="navbar_bar3" Text="bar3"> </ISWebDesktop:WebNavBar> </Bars> <FooterSettings> <FooterStyle Overflow="Hidden" GradientType="Vertical" BackColor2="Gainsboro" HorizontalAlign="Right" BackColor="White"></FooterStyle> </FooterSettings> <BarSettings> <CaptionStyle Overflow="Hidden" BackColor2="WhiteSmoke" BackColor="Gray" Font-Bold="True" Font-Names="Arial" Font-Size="11pt" ForeColor="White"> <Padding Top="4px" Left="4px" Right="4px" Bottom="4px"></Padding> </CaptionStyle> <BarStyle> <Normal Cursor="Hand" Overflow="Hidden" OverflowY="Hidden" OverflowX="Hidden" GradientType="Vertical" BackColor2="WhiteSmoke" BackColor="White" Font-Bold="True" Font-Names="Tahoma" Font-Size="8.25pt"></Normal> <Over BaseStyle="Normal" BackColor="LightSteelBlue"></Over> <Active BaseStyle="Normal" BackColor="LightGray"></Active> </BarStyle> </BarSettings> <BarItemSettings> <ItemStyle> <Normal Cursor="Hand" Overflow="Hidden" Font-Names="Tahoma" Font-Size="8.25pt"> <Padding Top="3px" Left="6px" Right="6px" Bottom="3px"></Padding> </Normal> <Over BaseStyle="Normal" BackColor="WhiteSmoke"></Over> <Active BaseStyle="Normal" BackColor="#C0C0FF" BorderColor="#0000C0" BorderStyle="Solid" BorderWidth="1px" Font-Bold="True"></Active> </ItemStyle> <ItemsContainerStyle Overflow="Auto" OverflowY="Auto" Font-Names="Tahoma" Font-Size="8.25pt" Height="100%" Width="100%"> <Padding Top="4px" Left="4px" Right="4px" Bottom="4px"></Padding> </ItemsContainerStyle> </BarItemSettings> <FrameStyle BackColor="White" BorderColor="Silver" BorderWidth="1px"></FrameStyle> </ISWebDesktop:WebNavPane> </PageTemplate> </ISWebDesktop:WebTabItem> </TabPages> <ClientSideEvents OnAfterTabChanged="wgDoResize(true, true);" /> </ISWebDesktop:WebTab>
Just like I told you before, onBarClick event is too fast to execute wgDoResize method. You need to set the time out for your method, because WebGrid need time to execute wgDoResize after it adjust the container. I just add this code on onBarClick event to your sample and it works well on my end.
function WebPane1_OnBarClick() { window.setTimeout(function () { wgDoResize(true, true); }, 1); }
Regards.
Riendy
or
Choose this if you're already a member of Intersoft Community Forum. You can link your OpenID account to your existing Intersoft Social ID.
Choose this if you don't have an Intersoft account yet. Your authenticated OpenID will be automatically linked to your new Intersoft account.
Enter your Wordpress Blogname