Intersoft Community - WebGrid Enterprise - Pager is not showing in web grid

Pager is not showing in web grid

yudi — Wed, 24 Jun 2015 03:03:31 GMT

This problem doesn't deals with WebGrid control. It is simply about layout using html and css.

Let's focus on the OpsCreate.aspx page. This page has a header and content. In the header, I add the Refresh and Create button. WebGrid will be added in the content area.

First, I wrap the header in a div element and define the style as follow.

div#header
{
    top: 0px;
    left: 0px;
    right: 0px;
    height: 40px;
    position: absolute;
}

<div id="header">
    <table class="style1" style="background-color: #bad3f5;
        vertical-align: middle; text-align: center; height: 40px">
        <tr>
            <td>
                <input id="RefreshCtrl" type="button" value="Refresh"
                    onclick="OnRefresh()" style="width: 80px" />
            </td>
            <td>
                <input id="CreateCtrl" type="button" value="Create"
                    onclick="OnCreate()" style="width: 80px" />
            </td>
        </tr>
    </table>
</div>

Next, add another div as the container for content. The height of this div is 100% minus the height of header. The snippet below shows how to do this using css.

div#content
{
    top: 40px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    position: absolute;
}

<div id="content">
    <div style="position: relative; height: 100%; overflow: hidden;">
        <ISWebGrid:WebGrid ID="GridCtrl" runat="server"
            Width="100%" Height="100%" UseDefaultStyle="True"
            RenderingMode="HTML5" DataSourceID="AccessDataSource1">
            ...
        </ISWebGrid:WebGrid>
    </div>
</div>

I enclosed the modified version of OpsCreate.aspx page for reference. By applying the above snippet code, your requirement - to show pager in WebGrid - now works.

This should helps.

Pager is not showing in web grid

Kasinadh.Somanchi@allegion.com — Fri, 19 Jun 2015 13:42:33 GMT

I am getting same result as before. For your reference i have attached the screen shot of the page.

I am using IE11 (Edge).

Below is the webgrid settings.

<ISWebGrid:WebGrid ID="GridCtrl" runat="server"
DefaultStyleMode="Elegant" Height="100%" UseDefaultStyle="True" Width="100%"
RenderingMode="HTML5">
<LayoutSettings AllowColumnFreezing="Yes" AllowColumnMove="Yes" AllowExport="Yes"
AllowFilter="Yes" AllowSorting="Yes" ApplyFiltersKey="Enter" RowHeightDefault="-1px"
AutoHeight="True" GroupRowInfoFormatDefault="[caption]: [value], MO Count: [count]"
HideColumnsWhenGrouped="No" PagingExportMode="ExportAllData" PagingMode="ClassicPaging"
PagingSize="50" PagingStyleUI="Slider">

Pager is not showing in web grid

yudi — Fri, 19 Jun 2015 08:00:26 GMT

I modified the unbound grid in OpsCreate.aspx page and bind it to Customers table of Northwind. The grid now has 91 rows. Next, simply enable paging feature and the pager is rendered without any issues on browser.

Screenshot:

Please let me know if you have different result.

Pager is not showing in web grid

Kasinadh.Somanchi@allegion.com — Thu, 18 Jun 2015 16:27:43 GMT

Thanks for your response.

I have modified the styles and i was able to fix the web tab issue. But the web grid pager issue still not resolved.

If the web grid has more than 30 rows it doesnt show the pager on screen but it shows the vertical and horrizontal scroll bars. To see the pager i will have to scroll down the vertical scroll bar. Actually pager is hidden inside ther webtab(frame).

Pager is not showing in web grid

yudi — Tue, 16 Jun 2015 03:21:26 GMT

The only issue i wanted the fix is to set the web tab height to 100% of the page height. For your reference i have attached the screen shot that shows the actual issue.

Thank you for the explanation. It helps a lot to identify the problem.

Please follow the steps below in order to fix the problem.

Open WorkFlowManagerFrame.aspx.

Add following style.

<style type="text/css">
    html, body, form
    {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
    }
</style>

Set the height of div element as the container of table to 100%.

<body id="body" runat="server" leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0"
    bgcolor="#BAD3F5">
    <form id="form1" runat="server">
    <div style="height: 100%;">
        <table style="height: 100%; table-layout: fixed; border-collapse: collapse; width: 100%;">
            ...
        </table>
    </div>
    </form>
</body>

The result will look like following.

For your reference, I enclosed the modified project. Please give it a spin and let us know how it works on your end.

Pager is not showing in web grid

Kasinadh.Somanchi@allegion.com — Fri, 12 Jun 2015 11:34:21 GMT

Hi Yudi,
Thanks for your response.

The application hierarchy is as follows.

Defaut.aspx ( this has the WebDesktopManager control, opens workflowmanager.aspx in WebDesktopWindow ) ---> WorkFlowManagerFrame.aspx ( this has the web explorer and web tab control and on panel click this opens the opscreate.aspx)---> OPSCreate.aspx (this has the grid control).

When OPSCreate.aspx is opened in a web tab it is not occupying the 100 % page height rather it is utilizing only 20% of the page height and shows vertical scroll bar. Because of this i am not able to see the grid rows completely.

The only issue i wanted the fix is to set the web tab height to 100% of the page height. For your reference i have attached the screen shot that shows the actual issue.

Thank you

Pager is not showing in web grid

yudi — Fri, 12 Jun 2015 10:30:04 GMT

Exception, "Integration Error: Can't find DesktopManager instance!", persist when I tried to open OpsCreate.aspx sample file. The exception is no longer persist if IntegratedToDesktopManager property of ProgressDlg WebDialogBox is set to False.

In this page web tab is occuppying the complete 100% height. I modified the styles still it is not coming perfect to me.

Please correct me if I'm wrong but there is no WebTab in OpsCreate.aspx page. Could you please inform me about the expected result of OpsCreate.aspx page so that I can assist you further.

Pager is not showing in web grid

Kasinadh.Somanchi@allegion.com — Tue, 09 Jun 2015 07:54:18 GMT

I didnt get any response on this. Please let me know what is the resolution.

Pager is not showing in web grid

Kasinadh.Somanchi@allegion.com — Fri, 05 Jun 2015 09:32:12 GMT

Hi Yudi,
Did you find any resolution for this?

Pager is not showing in web grid

Kasinadh.Somanchi@allegion.com — Thu, 04 Jun 2015 09:40:35 GMT

Hi Yudi,

Thanks for your response.

You can see the issue in the attached sample (OPS Create page). In this page web tab is occuppying the complete 100% height. I modified the styles still it is not coming perfect to me.

Regards,

Jagadhish

Pager is not showing in web grid

Kasinadh.Somanchi@allegion.com — Wed, 03 Jun 2015 15:34:12 GMT

Hi,

I had migrated my application from WebUIStudioNET2008R2 to intersoftstudio2014r2. In the newer version of the controls I am seeing an issue in the InterSoft WebGrid 9 where the Grid pager is not fixed. Pager disappears as the number of rows in the grid increases. To see the pager I will have to scroll down the scroll bar of web tab. [ Web grid is sitting inside the Web Tab]

I believe if the number of rows increases in the grid auto scroll bar should appear and the pager should always be fixed on the page. I am not seeing this behaviour in the web grid control.

More details below.

WebTab Settings:

<ISWebDesktop:WebTab ID="TabCtrl" runat="server" Height="100%" Width="100%" AllowTextWrapping="False"

DefaultTabSeparatorWidth="0px" RenderMode="ComplexImages" TabSeparator="False"

AllowClose="Yes" AllowScrolling="True">

</FrameStyle>

<ContainerStyle Overflow="Auto" OverflowY="Auto" OverflowX="Auto" BackColor="#BAD3F5"

BorderColor="#8DB2E3" BorderStyle="Solid" BorderWidth="1px" Height="100%" Width="100%"

Font-Names="segoe ui,tahoma" Font-Size="9pt">

</ContainerStyle>

WebGrid Settings:

<ISWebGrid:WebGrid ID="GridCtrl" runat="server" DataSourceID="MOInquiryLinqDataSource"

RenderingMode="HTML5" DefaultStyleMode="Elegant" Height="100%" UseDefaultStyle="True"

Width="100%" OnInitializeRow="OnInitializeRow" DataCacheStorage="Session">

<LayoutSettings AllowColumnFreezing="Yes" AllowColumnMove="Yes" AllowExport="Yes"

AllowFilter="Yes" AllowSorting="Yes" ApplyFiltersKey="Enter" Hierarchical="True"

ShowFilterStatus="True" VirtualPageSize="250" RowHeightDefault="-1px" AutoHeight="True"

HideColumnsWhenGrouped="No" PagingExportMode="ExportAllData" PagingMode="ClassicPaging"

PagingSize="20" PagingStyleUI="Slider" VirtualLoadMode="LargeData">

</LayoutSettings>

Please let me know what I am doing wrong here.