Report Viewer style issue in Rad Grid with MetroTouch skin

4 posts, 0 answers
  1. Brad
    Brad avatar
    20 posts
    Member since:
    Apr 2010

    Posted 21 Mar Link to this post

    I have a report viewer in a radgrid and the MetroTouch skin messes up the style of the report viewer and makes it look terrible.

    How do I get the report viewer to display properly inside a MetroTouch skinned grid?
  2. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 24 Mar Link to this post

    Hello,

    Can you please share your RadGrid markup that contains the ReportViewer in it, so that we can revise it locally and advise you furtehr?

    Regards,
    Maria Ilieva
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Brad
    Brad avatar
    20 posts
    Member since:
    Apr 2010

    Posted 24 Mar Link to this post

    Here is the markup for the grid.

    <telerik:RadGrid ID="rgJurisdictionPermitSearch" CssClass="radGrid" runat="server" DataSourceID="dsJurisdictionPermitSearch" Skin="MetroTouch" AutoGenerateColumns="False" MasterTableView-NoDetailRecordsText="There are no permits to display." MasterTableView-DataKeyNames="PID" MasterTableView-ClientDataKeyNames="PID" CellSpacing="-1" GridLines="Both" OnDetailTableDataBind="rgJurisdictionPermitSearch_DetailTableDataBind" OnItemCommand="rgJurisdictionPermitSearch_ItemCommand" EnableLinqExpressions="False" AllowSorting="True" GroupPanelPosition="Top" RenderMode="Auto" AllowPaging="true" PageSize="20" Width="100%" Font-Size="0.8em">
        <ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True">
            <Selecting AllowRowSelect="True" />
        </ClientSettings>
     
        <AlternatingItemStyle Font-Size="0.8em" />
        <GroupHeaderItemStyle Font-Size="0.8em" />
     
        <MasterTableView DataSourceID="dsJurisdictionPermitSearch" DataKeyNames="PID">
     
            <CommandItemTemplate>
                <telerik:RadButton ID="btnRefresh" runat="server" CommandArgument="Refresh" CommandName="Refresh" Text="Refresh"></telerik:RadButton>
            </CommandItemTemplate>
     
            <Columns>
                <telerik:GridBoundColumn DataField="PermitID" FilterControlAltText="Filter PermitID column" HeaderText="Permit #" ReadOnly="True" SortExpression="PermitID" UniqueName="PermitID">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <%--<telerik:GridBoundColumn DataField="MoveStartTime" DataType="System.DateTime" FilterControlAltText="Filter MoveStartTime column" HeaderText="Move Start" ReadOnly="True" SortExpression="MoveStartTime" UniqueName="MoveStartTime">
                <ColumnValidationSettings>
                    <ModelErrorMessage Text="" />
                </ColumnValidationSettings>
            </telerik:GridBoundColumn>--%>
     
                <telerik:GridTemplateColumn DataField="MoveStartTime" DataType="System.DateTime" FilterControlAltText="Filter MoveStartTime column" HeaderText="Move Start" ReadOnly="True" SortExpression="MoveStartTime" UniqueName="MoveStartTime">
                    <ItemTemplate>
                        <asp:Label ID="lblMoveStart" runat="server" Text='<%# DateTime.Parse(Eval("MoveStartTime").ToString()).ToShortDateString() %>'></asp:Label>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
     
                <telerik:GridBoundColumn DataField="PermitStatus" FilterControlAltText="Filter PermitStatus column" HeaderText="Permit Status" ReadOnly="True" SortExpression="PermitStatus" UniqueName="PermitStatus">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <telerik:GridBoundColumn DataField="ClientID" FilterControlAltText="Filter ClientID column" HeaderText="ClientID" ReadOnly="True" SortExpression="ClientID" UniqueName="ClientID" Visible="false">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text=""></ModelErrorMessage>
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <telerik:GridBoundColumn DataField="ClientName" FilterControlAltText="Filter ClientName column" HeaderText="Client" ReadOnly="True" SortExpression="ClientName" UniqueName="ClientName">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <telerik:GridBoundColumn DataField="Commodity" FilterControlAltText="Filter Commodity column" HeaderText="Commodity" ReadOnly="True" SortExpression="Commodity" UniqueName="Commodity">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <telerik:GridBoundColumn DataField="Unit" FilterControlAltText="Filter Unit column" HeaderText="Unit No." ReadOnly="True" SortExpression="Unit" UniqueName="Unit">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <telerik:GridBoundColumn DataField="ClientVehicleID" FilterControlAltText="Filter ClientVehicleID column" HeaderText="ClientVehicleID" ReadOnly="True" SortExpression="ClientVehicleID" UniqueName="ClientVehicleID" Visible="false">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text=""></ModelErrorMessage>
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <telerik:GridBoundColumn DataField="OrigLSD" FilterControlAltText="Filter OrigLSD column" HeaderText="Orig. LSD" ReadOnly="True" SortExpression="OrigLSD" UniqueName="OrigLSD">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <telerik:GridBoundColumn DataField="DestLSD" FilterControlAltText="Filter DestLSD column" HeaderText="Dest. LSD" ReadOnly="True" SortExpression="DestLSD" UniqueName="DestLSD">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <telerik:GridTemplateColumn DataField="PermitInspection" DataType="System.Double" FilterControlAltText="Filter PermitInspection column" HeaderText="Has Inspection" ReadOnly="True" SortExpression="PermitInspection" UniqueName="PermitInspection">
                    <ItemTemplate>
                        <%# Eval("PermitInspection") != null ? (Eval("PermitInspection").ToString() == "1" ? "YES" : "NO") : "NO" %>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
     
                <telerik:GridBoundColumn DataField="InspectionFee" DataType="System.Double" FilterControlAltText="Filter InspectionFee column" HeaderText="Inspection Fee" ReadOnly="True" SortExpression="InspectionFee" UniqueName="InspectionFee" DataFormatString="{0:C}">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridBoundColumn>
     
                <%-- CREATE TICKETS --%>
                <telerik:GridTemplateColumn AllowFiltering="false" HeaderText="Add Inspection" ItemStyle-Wrap="false" UniqueName="CreateInspection">
                    <ItemTemplate>
                        <telerik:RadButton ID="btnInsertInspection" runat="server" CommandName="InsertInspection" Text="Inspection" Skin="MetroTouch" Style="position: relative;" Font-Size="0.9em" />
                    </ItemTemplate>
     
                    <ItemStyle Wrap="False"></ItemStyle>
                </telerik:GridTemplateColumn>
     
            </Columns>
     
            <DetailTables>
                <telerik:GridTableView Name="dgvPermitInspections" runat="server" AllowFilteringByColumn="false" DataKeyNames="PermitInspectionID"
                    DataSourceID="dsPermitInspections" TableLayout="Auto" Width="100%" AllowAutomaticUpdates="true" AllowAutomaticInserts="true" AllowAutomaticDeletes="true" EditFormSettings-EditFormType="AutoGenerated" EditMode="EditForms">
                    <ParentTableRelation>
                        <telerik:GridRelationFields DetailKeyField="PID" MasterKeyField="PID" />
                    </ParentTableRelation>
     
                    <EditFormSettings EditColumn-ButtonType="PushButton">
                        <EditColumn ButtonType="PushButton"></EditColumn>
                    </EditFormSettings>
     
                    <Columns>
     
                        <telerik:GridBoundColumn DataField="PermitInspectionID" UniqueName="PermitInspectionID" ReadOnly="true" Visible="false">
                            <ColumnValidationSettings>
                                <ModelErrorMessage Text=""></ModelErrorMessage>
                            </ColumnValidationSettings>
                        </telerik:GridBoundColumn>
     
                        <telerik:GridTemplateColumn ColumnGroupName="Edit" UniqueName="EditCommandInspection" Display="true" Visible="true">
                            <ItemTemplate>
                                <telerik:RadButton ID="btnEditInspection" runat="server" Text="Edit" CommandArgument="Edit" CommandName="Edit" Skin="MetroTouch"></telerik:RadButton>
                            </ItemTemplate>
                        </telerik:GridTemplateColumn>
     
                        <telerik:GridTemplateColumn DataField="InspectionType" HeaderText="Inspection Type" UniqueName="InspectionType" FilterControlAltText="Filter InspectionType column" ReadOnly="false" SortExpression="InspectionType" ItemStyle-Width="10%" HeaderStyle-Width="10%">
                            <ItemTemplate>
                                <asp:Label ID="lblInspectionType" runat="server" Text='<%# Eval("InspectionType") %>' />
                            </ItemTemplate>
                            <EditItemTemplate>
                                <telerik:RadComboBox ID="rcmbInspectionType" runat="server" SelectedValue='<%# Bind("InspectionType") %>'>
                                    <Items>
                                        <telerik:RadComboBoxItem Text="PRE" Value="PRE" />
                                        <telerik:RadComboBoxItem Text="POST" Value="POST" />
                                    </Items>
                                </telerik:RadComboBox>
                                <asp:RequiredFieldValidator ID="rfvClassID" runat="server" ControlToValidate="rcmbInspectionType"
                                    CssClass="invalid" ErrorMessage="Class is required."></asp:RequiredFieldValidator>
                            </EditItemTemplate>
     
                            <HeaderStyle Width="10%"></HeaderStyle>
     
                            <ItemStyle Width="10%"></ItemStyle>
                        </telerik:GridTemplateColumn>
     
                        <telerik:GridTemplateColumn DataField="Notes" FilterControlAltText="Filter Notes column" HeaderText="Inspection Notes" ReadOnly="false" SortExpression="Notes" UniqueName="Notes" ItemStyle-Width="90%" HeaderStyle-Width="90%">
                            <ItemTemplate>
                                <asp:Label ID="lblInspectionNotes" runat="server" Text='<%# Eval("Notes") %>' />
                            </ItemTemplate>
                            <EditItemTemplate>
                                <telerik:RadTextBox ID="txtEditNotes" runat="server" TextMode="MultiLine" Rows="10" Text='<%# Bind("Notes") %>' Width="100%"></telerik:RadTextBox>
                            </EditItemTemplate>
     
                            <HeaderStyle Width="90%"></HeaderStyle>
     
                            <ItemStyle Width="90%"></ItemStyle>
                        </telerik:GridTemplateColumn>
     
                        <telerik:GridTemplateColumn ColumnGroupName="Delete" UniqueName="DeleteColumn" Display="true" Visible="true">
                            <ItemTemplate>
                                <telerik:RadButton ID="btnDeleteInspection" runat="server" Text="Delete" CommandArgument="Delete" CommandName="Delete" Skin="MetroTouch"></telerik:RadButton>
                            </ItemTemplate>
                        </telerik:GridTemplateColumn>
     
                    </Columns>
                </telerik:GridTableView>
     
                <telerik:GridTableView Name="dgvPermitDetails" runat="server" AllowFilteringByColumn="false" DataKeyNames="PID" DataSourceID="dsPermitDetails" TableLayout="Fixed" Width="100%">
                    <ParentTableRelation>
                        <telerik:GridRelationFields DetailKeyField="PID" MasterKeyField="PID" />
                    </ParentTableRelation>
                    <Columns>
                        <telerik:GridTemplateColumn DataField="PID" HeaderText="Permit Details" UniqueName="PermitDetails">
                            <ItemTemplate>
                                <div style="height: 620px;">
                                    <telerik:ReportViewer ID="rvPermitMoveSummary" runat="server" OnInit="rvPermitMoveSummary_Init" Height="500px" Visible="true" Width="100%" Skin="WebBlue" CssClass="RadGridReportViewer"></telerik:ReportViewer>
                                </div>
                            </ItemTemplate>
                        </telerik:GridTemplateColumn>
                    </Columns>
                </telerik:GridTableView>
            </DetailTables>
     
        </MasterTableView>
        <EditItemStyle Font-Size="0.8em" />
        <FooterStyle Font-Size="0.8em" />
        <HeaderStyle Font-Size="0.8em" />
        <FilterItemStyle Font-Size="0.8em" />
        <CommandItemStyle Font-Bold="False" Font-Italic="False" Font-Size="0.8em" ForeColor="Black" />
        <ActiveItemStyle Font-Size="0.8em" />
        <ItemStyle Font-Size="0.8em" ForeColor="Black" />
        <SelectedItemStyle Font-Size="0.8em" />
     
        <FilterMenu RenderMode="Auto"></FilterMenu>
     
        <HeaderContextMenu RenderMode="Auto"></HeaderContextMenu>
    </telerik:RadGrid>
  5. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 29 Mar Link to this post

    Hi,

    Try setting the Grid and the ReportViewer to have the same Skin and see how it goes.

    Regards,
    Maria Ilieva
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top