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

RadNumeric Input Postback style change

1 Answer 179 Views

Input

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

Dan asked on 09 Feb 2017, 09:47 PM

beforepostback.png

afterpostback.png

I'm having difficulty understanding why some controls are changing style after a postback. Namely I have a couple RadNumeric controls with spinners. At first load they look and behave as expected. After postback, the style changes somewhat dramatically. Whether or not I use Bootstrap styling the issue persists. I can someone get around it by rolling my own style with !important tags on everything, but seems like a kludge. Any idea of what's going on? Below is code from page that is in question.

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

<telerik:RadAjaxManager runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="ddlProduct">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="ddlProduct" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting>

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="pnl" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1" />

<telerik:RadFormDecorator RenderMode="Lightweight" ID="RadFormDecorator1" runat="server" DecorationZoneID="grid" DecoratedControls="All" EnableRoundedCorners="false" />

<h3>Build Plan</h3>

<br />

<asp:Panel ID="pnl" runat="server">

<div class="row">

<div class="col-md-1">

<telerik:RadLabel Text="Product" runat="server" CssClass="pull-right" />

</div>

<div class="col-md-2">

<telerik:RadDropDownList ID="ddlProduct" runat="server" CssClass="pull-left" Width="150" Height="30">

<Items>

<telerik:DropDownListItem Text="Whitney" Value="3" />

<telerik:DropDownListItem Text="Lhotse" Value="4" />

</Items>

</telerik:RadDropDownList>

</div>

<div class="col-md-2">

<telerik:RadNumericTextBox RenderMode="Lightweight" ShowSpinButtons="true" IncrementSettings-InterceptArrowKeys="true" IncrementSettings-InterceptMouseWheel="true"

runat="server" ID="txtYear" Width="120" Height="30" MinValue="2016" MaxValue="2050" NumberFormat-DecimalDigits="0" NumberFormat-GroupSeparator="" CssClass="" Label="Year">

</telerik:RadNumericTextBox>

</div>

<div class="col-md-2">

<telerik:RadNumericTextBox RenderMode="Lightweight" ShowSpinButtons="true" IncrementSettings-InterceptArrowKeys="true" IncrementSettings-InterceptMouseWheel="true"

runat="server" ID="txtWeek" Width="120" Height="30" MinValue="1" MaxValue="53" NumberFormat-DecimalDigits="0" Label="Week">

</telerik:RadNumericTextBox>

</div>

<div class="col-md-2">

<telerik:RadButton runat="server" ID="btnGo" class="btn btn-default" Height="30" Text="Go" OnClick="btnGo_Click" />

</div>

<br />

<div id="grid">

<telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" GridLines="None" runat="server" Width="55%"

AllowAutomaticInserts="True" PageSize="10" OnItemUpdated="RadGrid1_ItemUpdated" OnPreRender="RadGrid1_PreRender" AllowAutomaticUpdates="True" AllowPaging="True"

AutoGenerateColumns="False" OnBatchEditCommand="RadGrid1_BatchEditCommand" OnCancelCommand="RadGrid1_CancelCommand">

<MasterTableView CommandItemDisplay="TopAndBottom" DataKeyNames="BuildPlanId"

HorizontalAlign="NotSet" EditMode="Batch" AutoGenerateColumns="False">

<BatchEditingSettings EditType="Cell" />

<CommandItemSettings ShowAddNewRecordButton="false" />

<NoRecordsTemplate>

<div>

<p class="alert-danger"> There are no records to display</p>

</div>

</NoRecordsTemplate>

<Columns>

<telerik:GridBoundColumn DataField="BuildPlanId" HeaderText="Product" Visible="false" UniqueName="BuildPlanId" />

<telerik:GridBoundColumn DataField="Product" HeaderStyle-Width="12%" HeaderText="Product" ReadOnly="true" UniqueName="Product" />

<telerik:GridBoundColumn DataField="Area" HeaderStyle-Width="15%" HeaderText="Area" ReadOnly="true" UniqueName="Area" />

<telerik:GridBoundColumn DataField="Day" HeaderStyle-Width="12%" HeaderText="Day" ReadOnly="true" UniqueName="Day" />

<telerik:GridBoundColumn DataField="Date" HeaderStyle-Width="12%" HeaderText="Date" ReadOnly="true" UniqueName="Date" DataFormatString="{0: MM/dd/yyyy}" />

<telerik:GridTemplateColumn DataField="Quantity" HeaderStyle-Width="10%" UniqueName="Quantity" HeaderText="Quantity">

<ItemTemplate>

<%# Eval("Quantity") %>

</ItemTemplate>

<EditItemTemplate>

<telerik:RadNumericTextBox ID="txtQty" runat="server" MinValue="1" MaxValue="300" ShowSpinButtons="true" Width="80" NumberFormat-DecimalDigits="0" NumberFormat-GroupSeparator="" />

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="Shift" HeaderStyle-Width="10%" HeaderText="Shift" Visible="false" UniqueName="Shift" />

</Columns>

</MasterTableView>

<ClientSettings AllowKeyboardNavigation="true"></ClientSettings>

</telerik:RadGrid>

</div>

</asp:Panel>

</asp:Content>

RadNumeric Input Postback style change

1 Answer, 1 is accepted