Odd behaviour - width shrinking..

[Milan Gurung]

Hi,

I have two buttons inside a <td> tag - namely "SAVE" & "PRINT" - If <ajaxsetting> is configured, these bottons appear as if it's been align vertically rather than horizontal. To clarify,

It should be appear as - SAVE PRINT 

but not

SAVE

PRINT

Any idea? Thanks.

Milan G.

codesnippet:

telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

 <AjaxSettings>

                <telerik:AjaxSetting AjaxControlID="btnSave">

                    <UpdatedControls>

                        <telerik:AjaxUpdatedControl ControlID="gridInvoiceDetail" LoadingPanelID="loadingPanel"/>

                        <telerik:AjaxUpdatedControl ControlID="lblInvoiceDetail" LoadingPanelID="loadingPanel" />

                        <telerik:AjaxUpdatedControl ControlID="lblErrorMsg" LoadingPanelID="loadingPanel" />

                        <telerik:AjaxUpdatedControl ControlID="lblInfoMsg" LoadingPanelID="loadingPanel" />

                    </UpdatedControls>

                </telerik:AjaxSetting>

                <telerik:AjaxSetting AjaxControlID="gridInvoiceDetail">

                    <UpdatedControls>

                        <telerik:AjaxUpdatedControl ControlID="gridInvoiceDetail" LoadingPanelID="loadingPanel" />

                        <telerik:AjaxUpdatedControl ControlID= "txtTotalNet" LoadingPanelID="loadingPanel" />

                        <telerik:AjaxUpdatedControl ControlID= "txtVAT" LoadingPanelID="loadingPanel" />

                        <telerik:AjaxUpdatedControl ControlID= "txtInvoiceTotals" LoadingPanelID="loadingPanel" />

                        <telerik:AjaxUpdatedControl ControlID="lblInfoMsg" LoadingPanelID="loadingPanel" />

                        <telerik:AjaxUpdatedControl ControlID="btnSave" LoadingPanelID="loadingPanel" />

                        <telerik:AjaxUpdatedControl ControlID="lblErrorMsg" LoadingPanelID="loadingPanel" />

                    </UpdatedControls>

                </telerik:AjaxSetting>

                </AjaxSettings>

</telerik:RadAjaxManager>

<table border="0" cellpadding="1" cellspacing="1" id="rptParam" runat="server">

  <tr>

    <td colspan="4">

        <telerik:RadAjaxLoadingPanel ID="loadingPanel" runat="server" Height="17px"  Width="67px" InitialDelayTime="500" IsSticky="true" MinDisplayTime="500">

            <img alt="Loading..." src='Images/loading.gif' style="border: 0px;" />

        </telerik:RadAjaxLoadingPanel>

    </td>

  </tr>

  <tr>

    <td colspan="4">

        <asp:Label ID="lblInvoiceHeader" runat="server" CssClass="normalBlueBoldFont" Text="Fairfield Invoice Header"></asp:Label>

    </td>

  </tr>

  

  <tr>

    <td colspan="4">

        <asp:Label ID="lblErrorMsg" runat="server" CssClass="errorFont"></asp:Label>

        <asp:Label ID="lblInvHeaderID" runat="server" Visible="False"></asp:Label>

        </td>

  </tr>

  

  <tr>

    <td style="width: 558px">

        <asp:Label ID="Label14" runat="server" CssClass="normalBlueFont" Text="Pillar"></asp:Label></td>

    <td style="width: 385px">

        <telerik:RadComboBox ID="lstPillar" runat="server" Font-Names="Verdana"

            Font-Size="8pt" ForeColor="SteelBlue" Skin="WebBlue" CausesValidation="False" Width="200px">

            <CollapseAnimation Duration="200" Type="OutQuint" />

        </telerik:RadComboBox>

        <asp:RequiredFieldValidator ID="rfvPillar" runat="server" ControlToValidate="lstPillar"

            ErrorMessage="*"></asp:RequiredFieldValidator>

    </td>

    <td style="width: 527px">

        <asp:Label ID="Label10" runat="server" CssClass="normalBlueFont" Text="Invoice Type"></asp:Label></td>

    <td style="width: 297px">

        <telerik:RadComboBox ID="lstInvoiceType" runat="server" Font-Names="Verdana" Font-Size="8pt"

             Skin="WebBlue" Width="200px">

            <CollapseAnimation Duration="200" Type="OutQuint" />

        </telerik:RadComboBox>

        <asp:RequiredFieldValidator ID="rfvPOType" runat="server" ControlToValidate="lstInvoiceType"

            ErrorMessage="*"></asp:RequiredFieldValidator>

    </td>

  </tr>

  <tr>

    <td style="width: 558px;">

        <asp:Label ID="Label15" runat="server" CssClass="normalBlueFont" Text="PO Number"></asp:Label></td>

    <td style="width: 385px;">

    <telerik:RadNumericTextBox ID="txtPONumber" runat="server" Skin="" Width="190px" CssClass="normalBlueFont" NumberFormat-DecimalDigits="0" >

        <NumberFormat DecimalDigits="0" GroupSeparator="" />

    </telerik:RadNumericTextBox><asp:RequiredFieldValidator ID="rfvPONumber" runat="server"

            ControlToValidate="txtPONumber" ErrorMessage="*"></asp:RequiredFieldValidator></td>

    <td style="width: 527px;">

        <asp:Label ID="Label4" runat="server" CssClass="normalBlueFont" Text="Invoice Number"></asp:Label></td>

    <td style="width: 297px;">

        <asp:Label ID="lblInvoiceNo" runat="server" CssClass="normalBlueFont" Text="1521/5000"></asp:Label></td>

  </tr>

  <tr>

    <td style="width: 558px" valign="top">

        <asp:Label ID="Label18" runat="server" CssClass="normalBlueFont" Text="Client"></asp:Label></td>

    <td style="width: 385px" valign="top">

        <telerik:RadComboBox ID="lstClient" runat="server" Font-Names="Verdana" Font-Size="8pt"

            ForeColor="SteelBlue" Skin="WebBlue" Width="200px">

            <CollapseAnimation Duration="200" Type="OutQuint" />

        </telerik:RadComboBox>

        <asp:RequiredFieldValidator ID="rfvClient" runat="server" ControlToValidate="lstClient"

            ErrorMessage="*"></asp:RequiredFieldValidator></td>

    <td style="width: 527px" valign="top">

        <asp:Label ID="Label6" runat="server" CssClass="normalBlueFont" Text="Invoice Date"></asp:Label></td>

    <td style="width: 297px">

        <telerik:RadDatePicker ID="calInvoiceDate" runat="server" Skin="WebBlue" Width="200px">

            <DateInput LabelCssClass="radLabelCss_WebBlue" Skin="WebBlue" runat="server">

            </DateInput>

            <Calendar Skin="WebBlue" runat="server">

            </Calendar>

            <DatePopupButton CssClass="radPopupImage_Web20" />

        </telerik:RadDatePicker>

        <asp:RequiredFieldValidator ID="rfvCalInvoiceDate" runat="server" ControlToValidate="calInvoiceDate"

            ErrorMessage="*"></asp:RequiredFieldValidator>&nbsp;</td>

  </tr>

  <tr>

    <td style="width: 558px;" valign="top">

        <asp:Label ID="Label8" runat="server" CssClass="normalBlueFont" Text="VAT Tax Point"></asp:Label></td>

    <td style="width: 385px;" valign="top"><telerik:RadDatePicker ID="calVATTaxPoint" runat="server" Skin="WebBlue" Width="200px">

        <DateInput LabelCssClass="radLabelCss_WebBlue" Skin="WebBlue" runat="server">

        </DateInput>

        <Calendar Skin="WebBlue" runat="server">

        </Calendar>

        <DatePopupButton CssClass="radPopupImage_Web20" />

    </telerik:RadDatePicker>

        <asp:RequiredFieldValidator ID="rfvCalVatTaxPoint" runat="server" ControlToValidate="calVATTaxPoint"

            ErrorMessage="*"></asp:RequiredFieldValidator>&nbsp;

        </td>

    <td style="width: 527px;" valign="top">

        <asp:Label ID="Label11" runat="server" CssClass="normalBlueFont" Font-Bold="False"

            Text="Terms"></asp:Label></td>

    <td style="width: 297px;">

        <telerik:RadTextBox ID="txtTerms" runat="server" CssClass="normalBlueFont" Skin="Office2007"

            TextMode="MultiLine" Width="240px" Height="50px">

        </telerik:RadTextBox><asp:RequiredFieldValidator ID="rfvTerms" runat="server" ControlToValidate="txtTerms"

            ErrorMessage="*"></asp:RequiredFieldValidator>&nbsp;</td>

  </tr>

   <tr>

    <td style="width: 558px;">

        <asp:Label ID="Label2" runat="server" CssClass="normalBlueFont" Text="Currency"></asp:Label></td>

    <td style="width: 385px;">

        <telerik:RadComboBox ID="lstCurrency" runat="server" Font-Names="Verdana"

            Font-Size="8pt" ForeColor="SteelBlue" Skin="WebBlue" Width="200px">

            <CollapseAnimation Duration="200" Type="OutQuint" />

        </telerik:RadComboBox>

        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="lstCurrency"

            ErrorMessage="*"></asp:RequiredFieldValidator>

        </td>

    <td style="width: 527px;">

        <asp:Label ID="Label12" runat="server" CssClass="normalBlueFont" Text="FX Rate"></asp:Label></td>

    <td style="width: 297px;">

        <telerik:RadNumericTextBox ID="txtFXRate" runat="server" Skin="" Width="90px" CssClass="normalBlueFont">

        </telerik:RadNumericTextBox>

        </td>

  </tr>

   <tr>

    <td style="width: 558px;">

        <asp:Label ID="Label1" runat="server" CssClass="normalBlueFont" Text="Fairfield Fee"></asp:Label></td>

    <td style="width: 385px;"><telerik:RadNumericTextBox ID="txtFairfieldFee" runat="server" Skin="" Width="90px" CssClass="normalBlueFont">

    </telerik:RadNumericTextBox>

        </td>

    <td style="width: 527px;">

        <asp:Label ID="Label3" runat="server" CssClass="normalBlueFont" Text="Production Cost"></asp:Label></td>

    <td style="width: 297px;">

        <telerik:RadNumericTextBox ID="txtProductionCost" runat="server" Skin="" Width="90px" CssClass="normalBlueFont">

        </telerik:RadNumericTextBox></td>

  </tr>

   

   <tr>

    <td style="width: 558px;">

        <asp:Label ID="Label5" runat="server" CssClass="normalBlueFont" Text="Delivery Cost"></asp:Label></td>

    <td style="width: 385px;"><telerik:RadNumericTextBox ID="txtDeliveryCost" runat="server" Skin="" Width="90px" CssClass="normalBlueFont">

    </telerik:RadNumericTextBox>

        </td>

    <td style="width: 527px;">

        <asp:Label ID="Label7" runat="server" CssClass="normalBlueFont" Text="Levy Type"></asp:Label></td>

    <td style="width: 297px;">

        <telerik:RadComboBox ID="lstLevyType" runat="server" Font-Names="Verdana"

            Font-Size="8pt" Skin="WebBlue" Width="200px">

        <CollapseAnimation Duration="200" Type="OutQuint" />

    </telerik:RadComboBox>

        </td>

  </tr>

  <tr>

    <td style="width: 558px;">

        <asp:Label ID="Label17" runat="server" CssClass="normalBlueFont" Text="Asbof/Basbof"></asp:Label></td>

    <td style="width: 385px;">

        <telerik:RadNumericTextBox ID="txtAsbofBasbof" runat="server" Skin="" Width="90px" CssClass="normalBlueFont">

        </telerik:RadNumericTextBox>&nbsp;&nbsp;</td>

    <td style="width: 527px;">

        <asp:Label ID="Label13" runat="server" CssClass="normalBlueFont" Text="Total Net"></asp:Label></td>

    <td style="width: 297px;">

        <telerik:RadNumericTextBox ID="txtTotalNet" runat="server" Skin="" Width="90px" CssClass="normalBlueFont">

    </telerik:RadNumericTextBox><asp:RequiredFieldValidator ID="rfvTotalCost" runat="server" ControlToValidate="txtTotalNet"

            ErrorMessage="*"></asp:RequiredFieldValidator>&nbsp;</td>

  </tr>

  <tr>

    <td style="width: 558px;">

        <asp:Label ID="Label9" runat="server" CssClass="normalBlueFont" Text="VAT"></asp:Label></td>

    <td style="width: 385px;">

        <telerik:RadNumericTextBox ID="txtVAT" runat="server" Skin="" Width="90px" CssClass="normalBlueFont">

    </telerik:RadNumericTextBox><asp:RequiredFieldValidator ID="rfvVAT" runat="server" ControlToValidate="txtVAT"

            ErrorMessage="*"></asp:RequiredFieldValidator></td>

    <td style="width: 527px;">

        <asp:Label ID="Label16" runat="server" CssClass="normalBlueFont" Text="Invoice Totals"></asp:Label></td>

    <td style="width: 297px;">

        <telerik:RadNumericTextBox ID="txtInvoiceTotals" runat="server" Skin="" Width="90px" CssClass="normalBlueFont">

    </telerik:RadNumericTextBox><asp:RequiredFieldValidator ID="rfvInvoiceTotals" runat="server" ControlToValidate="txtInvoiceTotals"

            ErrorMessage="*"></asp:RequiredFieldValidator></td>

  </tr>

   <tr>

    <td style="width: 558px;">

        </td>

    <td style="width: 385px;">

        <asp:Button ID="btnSave" text="SAVE" runat="server" CssClass="normalBlueFont" />

        <asp:Button ID="btnPrint" text="PRINT" runat="server" CssClass="normalBlueFont" /></td>

    <td><asp:Label ID="lblInfoMsg" runat="server" CssClass="errorFont"></asp:Label></td>

    <td></td>

  </tr>

    <tr>

    <td>&nbsp;</td>

    <td colspan="3">

        &nbsp;

   </td>

  </tr>  

<table>  

[Dimo]

Hi Milan,

Please refer to:

http://www.telerik.com/help/aspnet-ajax/layout-problem-updated-controls-on-new-line.html

You can also define an inline render mode only for some AjaxSettings. This has to be done programmatically in the AjaxSettingCreated event handler.


Greetings,
Dimo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Milan Gurung]

Thanks Dino.