This is a migrated thread and some comments may be shown as answers.

GridTemplateColumn bad rendering since new update

3 Answers 39 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Jocelyn
Top achievements
Rank 1
Jocelyn asked on 19 Oct 2012, 12:50 PM
Hi,

since the new update my GridTemplateColumn have a bad rendering. See the image below.

RadGrid:

<telerik:RadGrid ID="gridMPA" runat="server" CellSpacing="0" BorderWidth="0" GridLines="None">
    <FilterMenu EnableImageSprites="False">
    </FilterMenu>
    <ClientSettings>
        <Selecting CellSelectionMode="None"></Selecting>
    </ClientSettings>
    <MasterTableView DataKeyNames="Noauto" EditMode="InPlace">
        <CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>
        <RowIndicatorColumn Visible="True" FilterControlAltText="Filter RowIndicator column">
            <HeaderStyle Width="20px"></HeaderStyle>
        </RowIndicatorColumn>
        <ExpandCollapseColumn Visible="True" FilterControlAltText="Filter ExpandColumn column">
            <HeaderStyle Width="20px"></HeaderStyle>
        </ExpandCollapseColumn>
        <Columns>
            <telerik:GridBoundColumn AutoPostBackOnFilter="true" FilterControlAltText="Filter colNoAuto column"
                HeaderText="NoAuto" UniqueName="colNoAuto" ShowFilterIcon="false" Visible="false"
                DataField="Noauto" ReadOnly="true">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn AutoPostBackOnFilter="true" FilterControlAltText="Filter colNumero column"
                HeaderText="Numero" UniqueName="colNumero" ShowFilterIcon="false" DataField="Numero"
                ReadOnly="true">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn AutoPostBackOnFilter="true" FilterControlAltText="Filter colMedicament column"
                HeaderText="M├ędicament" UniqueName="colMedicament" ShowFilterIcon="false" DataField="NomMedicament"
                ReadOnly="true">
                <HeaderStyle Width="200px" />
                <ItemStyle Wrap="false" />
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn AutoPostBackOnFilter="true" FilterControlAltText="Filter colDose column"
                HeaderText="Dose" UniqueName="colDose" ShowFilterIcon="false" DataField="Dose"
                ReadOnly="true">
                <ItemStyle Wrap="false" />
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn AutoPostBackOnFilter="true" FilterControlAltText="Filter colPosologie column"
                HeaderText="Posologie" UniqueName="colPosologie" ShowFilterIcon="false" DataField="Posologie"
                ReadOnly="true">
                <ItemStyle Wrap="false" />
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn AutoPostBackOnFilter="true" FilterControlAltText="Filter colAHFS column"
                HeaderText="Code A.H.F.S." UniqueName="colAHFS" ShowFilterIcon="false" DataField="AHFS"
                ReadOnly="true">
                <ItemStyle Wrap="false" />
            </telerik:GridBoundColumn>
            <telerik:GridImageColumn UniqueName="colMPA" HeaderText="MPA" ImageUrl="~/Images/empty.png"
                ShowFilterIcon="false" AllowFiltering="false">
                <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
                <ItemStyle HorizontalAlign="Center"></ItemStyle>
            </telerik:GridImageColumn>
            <telerik:GridImageColumn UniqueName="colDivergence" HeaderText="Divergence" ImageUrl="~/Images/empty.png"
                ShowFilterIcon="false" AllowFiltering="false">
                <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
                <ItemStyle HorizontalAlign="Center"></ItemStyle>
            </telerik:GridImageColumn>
            <telerik:GridButtonColumn ButtonType="ImageButton" UniqueName="colSub" HeaderText="Sub."
                CommandName="SelectSub" ImageUrl="~/Images/empty.png">
                <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
                <ItemStyle HorizontalAlign="Center"></ItemStyle>
            </telerik:GridButtonColumn>
            <telerik:GridButtonColumn ButtonType="ImageButton" UniqueName="colTest" HeaderText="Test"
                CommandName="AddDivergence" ImageUrl="~/Images/empty.png">
                <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
                <ItemStyle HorizontalAlign="Center"></ItemStyle>
            </telerik:GridButtonColumn>
            <telerik:GridTemplateColumn UniqueName="colCesser" InitializeTemplatesFirst="false"
                ReadOnly="true" ShowFilterIcon="false">
                <HeaderTemplate>
                    <div class="center">
                        <telerik:RadCodeBlock runat="server">
                            <%=GetMessageEx(5220).Texte%>
                        </telerik:RadCodeBlock>
                    </div>
                    <div class="center">
                        <telerik:RadButton ID="colCesser_chk_header" runat="server" ButtonType="ToggleButton" CausesValidation="false"
                            ToggleType="CheckBox" AutoPostBack="true" OnCheckedChanged="chkHeader_CheckedChanged">
                        </telerik:RadButton>
                    </div>
                </HeaderTemplate>
                <ItemTemplate>
                    <div class="center">
                        <telerik:RadButton ID="colCesser_chk_item" runat="server" ButtonType="ToggleButton" CausesValidation="false"
                            ToggleType="CheckBox" AutoPostBack="true" Checked='<%# Eval("Cesser") %>' OnCheckedChanged="chkCesser_CheckedChanged">
                        </telerik:RadButton>
                    </div>
                </ItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridTemplateColumn UniqueName="colContinuer" InitializeTemplatesFirst="false"
                ReadOnly="true" ShowFilterIcon="false">
                <HeaderTemplate>
                    <div class="center">
                        <telerik:RadCodeBlock runat="server">
                            <%=GetMessageEx(1214).Texte%>
                        </telerik:RadCodeBlock>
                    </div>
                    <div class="center">
                        <telerik:RadButton ID="colContinuer_chk_header" runat="server" ButtonType="ToggleButton" CausesValidation="false"
                            ToggleType="CheckBox" AutoPostBack="true" OnCheckedChanged="chkHeader_CheckedChanged">
                        </telerik:RadButton>
                    </div>
                </HeaderTemplate>
                <ItemTemplate>
                    <div class="center">
                        <telerik:RadButton ID="colContinuer_chk_item" runat="server" ButtonType="ToggleButton" CausesValidation="false"
                            ToggleType="CheckBox" AutoPostBack="true" Checked='<%# Eval("Continuer") %>'
                            OnCheckedChanged="chkContinuer_CheckedChanged">
                        </telerik:RadButton>
                    </div>
                </ItemTemplate>
                <HeaderStyle Wrap="false" />
            </telerik:GridTemplateColumn>
            <telerik:GridTemplateColumn UniqueName="colModifier" InitializeTemplatesFirst="false"
                ReadOnly="true" ShowFilterIcon="false">
                <HeaderTemplate>
                    <div class="center">
                        <telerik:RadCodeBlock runat="server">
                            <%=GetMessageEx(1042).Texte%>
                        </telerik:RadCodeBlock>
                    </div>
                    <div class="center">
                        <telerik:RadButton ID="colModifier_chk_header" runat="server" ButtonType="ToggleButton" CausesValidation="false"
                            ToggleType="CheckBox" AutoPostBack="true" OnCheckedChanged="chkHeader_CheckedChanged">
                        </telerik:RadButton>
                    </div>
                </HeaderTemplate>
                <ItemTemplate>
                    <div class="center">
                        <telerik:RadButton ID="colModifier_chk_item" runat="server" ButtonType="ToggleButton" CausesValidation="false"
                            ToggleType="CheckBox" AutoPostBack="true" Checked='<%# Eval("Modifier") %>' OnCheckedChanged="chkModifier_CheckedChanged">
                        </telerik:RadButton>
                    </div>
                </ItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridEditCommandColumn FilterControlAltText="Filter EditCommandColumn column"
                ButtonType="ImageButton" EditText="Modifier" Resizable="False" EditImageUrl="Images/Icons/006-Write-New-Icon.png"
                UniqueName="colEdit">
                <HeaderStyle Width="32px"></HeaderStyle>
                <ItemStyle Width="32px" />
            </telerik:GridEditCommandColumn>
            <telerik:GridTemplateColumn UniqueName="colQte" InitializeTemplatesFirst="false"
                ShowFilterIcon="false">
                <HeaderTemplate>
                    <div class="center">
                        <telerik:RadButton ID="colQte_btn_header" runat="server" ButtonType="StandardButton" CausesValidation="false"
                            AutoPostBack="false" OnClientClicked="openQteFillWindow" OnLoad="btnRemplir_Load">
                        </telerik:RadButton>
                    </div>
                </HeaderTemplate>
                <ItemTemplate>
                    <div class="center">
                        <%#Eval("Quantite")%>
                    </div>
                </ItemTemplate>
                <EditItemTemplate>
                    <div class="center">
                        <telerik:RadNumericTextBox runat="server" ID="colQte_txt_edit" MinValue="0" MaxLength="4"
                            Width="50px" DbValue='<%#Bind("Quantite")%>'>
                        </telerik:RadNumericTextBox>
                    </div>
                </EditItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridTemplateColumn UniqueName="colRen" InitializeTemplatesFirst="false"
                ShowFilterIcon="false">
                <HeaderTemplate>
                    <div class="center">
                        <telerik:RadButton ID="colRen_btn_header" runat="server" ButtonType="StandardButton"
                            AutoPostBack="false" OnClientClicked="openRenFillWindow" OnLoad="btnRemplir_Load">
                        </telerik:RadButton>
                    </div>
                </HeaderTemplate>
                <ItemTemplate>
                    <div class="center">
                        <%#Eval("Renouvellements")%>
                    </div>
                </ItemTemplate>
                <EditItemTemplate>
                    <div class="center">
                        <telerik:RadNumericTextBox runat="server" ID="colRen_txt_edit" MinValue="0" MaxLength="4"
                            Width="50px" DbValue='<%#Bind("Renouvellements")%>'>
                        </telerik:RadNumericTextBox>
                    </div>
                </EditItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridBoundColumn AutoPostBackOnFilter="true" FilterControlAltText="Filter colRaison column"
                HeaderText="Raison" UniqueName="colRaison" ShowFilterIcon="false" DataField="Commentaire">
                <HeaderStyle Width="220px" />
            </telerik:GridBoundColumn>
        </Columns>
        <EditFormSettings>
            <EditColumn FilterControlAltText="Filter EditCommandColumn column">
            </EditColumn>
        </EditFormSettings>
        <SortExpressions>
            <telerik:GridSortExpression FieldName="Numero" SortOrder="Ascending" />
        </SortExpressions>
    </MasterTableView>
    <ClientSettings AllowKeyboardNavigation="true">
        <ClientEvents OnCommand="gridMPA_OnCommand" />
        <KeyboardNavigationSettings AllowSubmitOnEnter="true" />
        <Resizing EnableRealTimeResize="true" />
    </ClientSettings>
</telerik:RadGrid>

Thanks

3 Answers, 1 is accepted

Sort by
0
Angel Petrov
Telerik team
answered on 23 Oct 2012, 12:33 PM
Hi Jocelyn,

This is not an expected behaviour of RadGrid. However in the code I have noticed that you have a CSS class named "center". Could you please remove the div elements that contain that class and tell us if the problem replicates again? If it does please elaborate on which browser and browser version you use.

All the best,
Angel Petrov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Jocelyn
Top achievements
Rank 1
answered on 23 Oct 2012, 01:15 PM
Hi Angel,

Thanks for you answer. My class only contains "text-align: center" and the problem is still there if I remove the entire div.

I have this problem on the lastest chrome and firefox version, IE9 and IE8. It only works on IE7.

Thanks
0
Accepted
Angel Petrov
Telerik team
answered on 25 Oct 2012, 01:38 PM
Hi Jocelyn,

I have replicated your scenario and the problem comes from the RadButton control. When not setting text in the button you should set the height to the according height of the cell. Using the mentioned approach the rendering should behave correctly. Attached is a simple solution for you to review.

Regards,
Angel Petrov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Grid
Asked by
Jocelyn
Top achievements
Rank 1
Answers by
Angel Petrov
Telerik team
Jocelyn
Top achievements
Rank 1
Share this question
or