Last Row cut off when scrolled to bottom

5 posts, 0 answers
  1. Charles
    Charles avatar
    6 posts
    Member since:
    May 2008

    Posted 12 Dec 2014 Link to this post

    I have a grid Static headers and AllowScroll set to true. When I scroll all the way down the last row is not completely visible. And worse, if you edit the row you can't see the edit controls at all. I am using the latest UI version and the latest IE. Please see the attached screen shot. How do I fix this?

    Thanks.

    Charles

    <telerik:RadGrid ID="rgNotifications" runat="server" AutoGenerateColumns="False" CellSpacing="0"  AllowPaging="false" AllowSorting="true" Width="920px" Skin="Windows7"
        Height="265px" >
        <ClientSettings EnableRowHoverStyle="true">
            <Scrolling AllowScroll="True" UseStaticHeaders="true" />
        </ClientSettings>
        <MasterTableView  DataSourceID="sqldsNotificationAddresses" ShowGroupFooter="false" DataKeyNames="NotificationAddressID" Width="820px"
            EditMode="InPlace" CommandItemDisplay="Top"
            CommandItemSettings-AddNewRecordText="Add Employee Notification"
            AllowAutomaticInserts="True" AllowAutomaticUpdates="True" AllowAutomaticDeletes="true" >
                                                                     
        <CommandItemSettings ShowRefreshButton="false" />
        <NoRecordsTemplate>
            <div class="ACHD1">There are no Employee Notifications.</div>
        </NoRecordsTemplate>
        <ColumnGroups>
            <telerik:GridColumnGroup HeaderText="Send Notification For:" Name="Notify">
                <HeaderStyle HorizontalAlign="Center" />
            </telerik:GridColumnGroup>
        </ColumnGroups>
                                                                 
        <Columns>
            <telerik:GridTemplateColumn HeaderText="Always<br />Notify on<br />Round Robin" UniqueName="NotifyRoundRobin">
                <ItemTemplate>
                    <asp:CheckBox ID="cbAlwaysNotifyOnRoundRobin" runat="server" Checked='<%# Eval("AlwaysNotifyOnRoundRobin")%>' AutoPostBack="true" OnCheckedChanged="cbAlwaysNotifyOnRoundRobin_CheckChanged" />
                </ItemTemplate>
                <EditItemTemplate>
                </EditItemTemplate>
                <InsertItemTemplate>
                </InsertItemTemplate>
                <ItemStyle Width="55px" />
            </telerik:GridTemplateColumn>
            <telerik:GridBoundColumn HeaderText="Employee Name" DataField="EmployeeName">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn HeaderText="Email Address" DataField="EmailAddress">
            </telerik:GridBoundColumn>
            <telerik:GridMaskedColumn HeaderText="SMS Text Number" DataField="SMSPhoneNumber" Mask="(###) ###-####">
            </telerik:GridMaskedColumn>
            <telerik:GridTemplateColumn HeaderText="Contact-Us Lead" ColumnGroupName="Notify">
                <ItemTemplate>
                    <asp:CheckBox ID="cbNotifyContactUsLead" runat="server" Checked='<%# Eval("NotifyContactUsLead")%>' AutoPostBack="true" OnCheckedChanged="cbNotifyContactUsLead_CheckChanged" />
                </ItemTemplate>
                <EditItemTemplate>
                </EditItemTemplate>
                <InsertItemTemplate>
                </InsertItemTemplate>
                <ItemStyle Width="55px" />
            </telerik:GridTemplateColumn>
            <telerik:GridTemplateColumn HeaderText="Credit App" ColumnGroupName="Notify">
                <ItemTemplate>
                    <asp:CheckBox ID="cbNotifyCreditApp" runat="server" Checked='<%# Eval("NotifyCreditApp")%>' AutoPostBack="true" OnCheckedChanged="cbNotifyCreditApp_CheckChanged" />
                </ItemTemplate>
                <EditItemTemplate>
                </EditItemTemplate>
                <InsertItemTemplate>
                </InsertItemTemplate>
                <ItemStyle Width="55px" />
            </telerik:GridTemplateColumn>
            <telerik:GridTemplateColumn HeaderText="3rd Party Lead" ColumnGroupName="Notify">
                <ItemTemplate>
                    <asp:CheckBox ID="cbNotifyEmailParserLead" runat="server" Checked='<%# Eval("NotifyEmailParserLead")%>' AutoPostBack="true" OnCheckedChanged="cbNotifyEmailParserLead_CheckChanged" />
                </ItemTemplate>
                <EditItemTemplate>
                </EditItemTemplate>
                <InsertItemTemplate>
                </InsertItemTemplate>
                <ItemStyle Width="55px" />
            </telerik:GridTemplateColumn>
            <telerik:GridButtonColumn ConfirmText="Delete this EmployeeNotification?" ConfirmDialogType="RadWindow"
                ConfirmTitle="Delete" ButtonType="ImageButton" CommandName="Delete" UniqueName="DeleteColumn">
                <ItemStyle Width="30px" />
            </telerik:GridButtonColumn>
            <telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditColumn">
                <ItemStyle Width="65px" />
            </telerik:GridEditCommandColumn>
                                                                     
        </Columns>
        </MasterTableView>
    </telerik:RadGrid>
  2. Galin
    Admin
    Galin avatar
    526 posts

    Posted 17 Dec 2014 Link to this post

    Hi Charles,

    The described issue is replicated on my side therefore I will forward it to our developers. In the meantime please use the following js workaround

    function onGridCreated(sender, args) {
        sender.repaint();
    }

    I hope this helps.

    Regards,
    Galin
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Charles
    Charles avatar
    6 posts
    Member since:
    May 2008

    Posted 23 Dec 2014 in reply to Galin Link to this post

    Hi Galin,

    I added the function call to the client settings as below and it had no effect. Is this the correct place to put the event call?

    <telerik:RadGrid ID="rgNotifications" runat="server" AutoGenerateColumns="False" CellSpacing="0"  AllowPaging="false" AllowSorting="true" Width="920px" Skin="Windows7"
        Height="265px" >
        <ClientSettings EnableRowHoverStyle="true" ClientEvents-OnGridCreated="onGridCreated">
            <Scrolling AllowScroll="True" UseStaticHeaders="true" />
        </ClientSettings>


    thanks.

    Charles
  5. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1803 posts

    Posted 26 Dec 2014 Link to this post

    Hello Charles,

    Could you please try the following workaround instead and see if it will make any difference on your end too:
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function pageLoad() {
                var grid = $find("<%=rgNotifications.ClientID%>");
                grid.repaint();
            }
        </script>
    </telerik:RadCodeBlock>

    I have tested it with your exact RadGrid settings and it seems to fix the problem in IE 11.


    Best Regards,
    Konstantin Dikov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  6. Martin
    Martin avatar
    84 posts
    Member since:
    Apr 2009

    Posted 31 May Link to this post

    grid.repaint(); alone does not work for us

    what we do is that on window_resized() which gets called also when the grid is loaded, we take to account the bottom of the page, width of header and paging if applicable and calculate the size of the scrollable area

    grid.get_element().style.height = (bottomOfPage.offsetTop - pagingValueAdjustment - headerValueAdjustement) + "px";

    then we call

    grid.repaint();

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017