Questions on UI for ASP.NET AJAX Forum

43 answers

9.0K+ views

This sticky thread lists known issues and breaking changes introduced in the UI for ASP.NET AJAX releases.

Q3 2011 (Version number: 2011.3.1115)

Problem: When adding items to OData-enabled controls (RadMenu, RadTreeView, RadListBox, RadComboBox) through design time erroneous markup is applied to the control:

<telerik:RadListBox runat="server" ID="RadListBox1">
    <Items>
    </Items>
    <WebServiceSettings>
        <ODataSettings InitialContainerName="">
        </ODataSettings>
    </WebServiceSettings>
</telerik:RadListBox>

Please note the added ODataSettings section. It will cause JavaScript errors on the page.

Solution: Remove the ODataSetting section and the issue will vanish. The problem is also fixed in the Q3 SP1 release, version number 2011.3.1305

General Discussions

updated answer on 29 May 2025

1 answer

764 views

I'm getting an error with Telerik

When I run my project I'm getting this error

Could not load file or assembly 'Telerik.Web.UI' or one of its dependencies. The located assembly's manifest definition does not match the assembly reference. (Exception from HRESULT: 0x80131040)

In my web.config I checked that the version in the web.config is the same as the version I'm using in references

General Discussions

answered on 22 Oct 2021

0 answers

3 views

Circular Gauge Center Template value will not center within

I have a Circular Gauge within a bootstrap card. I cannot seem to get the "CenterTemplate" value centered in the gauge. Is there a setting I'm missing or does someone have a custom CSS to help. below is the html markup along with an attached image of the gauge.

Thank you in advance for any help!

<div class="card shadow mb-4" id="gaugecontainer1">
     <div class="card-header py-3">
	   <h6 class="m-0 font-weight-bold text-primary">Daily Productivity Rate</h6>
       </div>
	<div class="card-body">
            <div class="container-fluid align-content-center">								
	        <telerik:RadCircularGauge ID="Gauge1" runat="server" Width="90%" Height="350px" Font-Size="X-Large"   Skin="Silk" CssClass="gauge-left-padd">
		<ClientEvents OnLoad="Gauge1_OnLoad" />
		<CenterTemplate>
			#:value # %
		</CenterTemplate>
		<Scale Min="0" Max="200">
		         <Labels Visible="true" Position="Inside" Font="12px Arial,Helvetica,sans-serif" Format="{0}%" />
			<MajorTicks Visible="true" Size="20" Color="Black" />
			<MinorTicks Visible="true" Color="Black" />
		 </Scale>
		<ColorsCollection>
			<telerik:ArcGaugeColor From="0" To="79" Color="Red" />
			<telerik:ArcGaugeColor From="80" To="90" Color="Orange" />
			<telerik:ArcGaugeColor From="91" To="100" Color="Yellow" />
			<telerik:ArcGaugeColor From="101" To="120" Color="LightGreen" />
			<telerik:ArcGaugeColor From="121" To="200" Color="Blue" />
		</ColorsCollection>
	</telerik:RadCircularGauge>								
     </div>
 </div>
</div>
.gauge-left-padd {
    padding-left: 2em;
}

<script type="text/javascript">
    var gauge1, TO = false;
    function Gauge1_OnLoad(sender, args) {
	gauge1 = sender.get_kendoWidget();
     }
     window.onresize = (function () {
	if (TO !== false)
		clearTimeout(TO);
	TO = setTimeout(resizeGauge, 200);
        });
        function resizeGauge() {
	       if (gauge1) {
		   gauge1.resize();
	        }
          }
</script>

Gauge

asked on 18 Sep 2025

0 answers

4 views

Nested ListView - How to Connect

How can I connect listChild to listParent using the Parent_ID?

<telerik:RadListView ID="listParent" DataKeyNames="Parent_ID" DataSourceID="sqlParent" RenderMode="Lightweight" runat="server">
    <ItemTemplate>
        ID: <%# Eval("Parent_ID") %>
        <%# Eval("Parent_Name") %>

        <telerik:RadListView ID="listChild" DataKeyNames="Parent_ID" DataSourceID="sqlChild" RenderMode="Lightweight" runat="server">
            <ItemTemplate>
                <!-- child details would go here -->
            </ItemTemplate>
        </telerik:RadListView>

        <asp:SqlDataSource ID="sqlChild" runat="server" ConnectionString="<%$ ConnectionStrings:cs %>" SelectCommand="Impact.usp_exe_get_Child" SelectCommandType="StoredProcedure">
            <SelectParameters>
                <asp:Parameter Name="Parent_ID" /> <!-- Parent ID from listParent-->
            </SelectParameters>
        </asp:SqlDataSource>
    </ItemTemplate>
</telerik:RadListView>

<asp:SqlDataSource ID="sqlParent" runat="server" ConnectionString="<%$ ConnectionStrings:cs %>" SelectCommand="Impact.usp_exe_get_Parent" SelectCommandType="StoredProcedure"></asp:SqlDataSource>

ListView

updated question on 17 Sep 2025

1 answer

5 views

OTPInput Autopostback - workaround or in future update?

I don't think OTPInput control has an autopostback and so I am using this code to call client event then do post back via hidden link button to my server side function. This is used for allowing a user to enter a three digit entry key number and doesn't require them to enter the numbers and press a button for speed. If the control had autopostback when all boxes have a value and the last box value is entered this would make the control much more useful. Is there a better way of doing this?

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" />


<telerik:RadOTPInput ID="otpKeySearch" runat="server" Placeholder="0-9" Space="true" Type="Number">
<Items>
<telerik:OTPInputItem GroupLength="3" />
</Items>
<ClientEvents OnChange="keyOTPOnChange" />
</telerik:RadOTPInput>


<asp:LinkButton ID="btnOtpPostBack"
runat="server"
OnClick="otpKeySearchChanged"
UseSubmitBehavior="false"
Style="display:none;" />

<script type="text/javascript">
// Fires every time the OTP value changes
function keyOTPOnChange(sender, args) {
var value = args.get_value() || "";
// Only act once we have exactly three digits 0-9
if (value.length === 3 && /^\d{3}$/.test(value)) {
// Force a full postback to the hidden LinkButton
__doPostBack('<%= btnOtpPostBack.UniqueID %>', '');
}
}
</script>

' Handles the hidden LinkButton postback
Protected Sub otpKeySearchChanged(sender As Object, e As EventArgs) Handles btnOtpPostBack.Click
Dim theKeyNumber As String = ""
If otpKeySearch IsNot Nothing AndAlso otpKeySearch.Value IsNot Nothing Then
theKeyNumber = otpKeySearch.Value.Trim()
End If
If theKeyNumber <> "" AndAlso theKeyNumber.Length = 3 AndAlso IsNumeric(theKeyNumber) Then
' get key number from database and perform redirect to keys panel of relevant entry dashboard
End If
' If we got here (redirect above failed - value was invalid or key not found in database) show the radNotify with message to user
notifyInvalidSearch.Show()
End Sub

Ajax

Input

OTPInput

answered on 15 Sep 2025

3 answers

11 views

How to show and hidden Panel with button?

I am implementing a one time password with google authenticator for login page. After checking the user id and password is correct, I need to hidden the login box and show the QR code, OTP textbox and submit button. I saw sample using Panel.visible = true/false to switch. It is work in Page_Load to set default Panel_GoogleAuth.visible = false, but it is not work in the login button onClick event. It can't show the Panel_GoogleAuth and just hidden the login button but not the whole Panel_Login. Does anyone know why?

My reference: Sample

aspx:

<asp:Panel ID="Panel_GoogleAuth" runat="server" Font-Names="Arial" Font-Size="12pt" HorizontalAlign="Center" Width="1024px">
    <div class="row">
        <div class="col-3"></div>

        <div class="col-5">
            <fieldset class="TOTP">
                <asp:Label ID="lblScanQRCode" runat="server" Style="padding-top: 4px">Sceen the QR Code in Google Authenticator</asp:Label>
                <br />

                <asp:Image ID="imgQRCode" runat="server" Width="200" Height="200" />
                <asp:HiddenField ID="hfSecretKey" runat="server" />
                <br />
                <asp:TextBox ID="txtOTP" runat="server" placeholder="Enter One-Time-Password"></asp:TextBox>
                <asp:Button ID="btnVerify" runat="server"Text="Verify OTP" />
                <br /><br />
                <asp:Label ID="lblMessage" runat="server"></asp:Label>
            </fieldset>
        </div>
    </div>
</asp:Panel>


<telerik:RadAjaxPanel ID="StaffPanel" runat="server" Width="99%">
    <div id="wrap-content">
        <asp:Panel ID="Panel_Login" runat="server" Font-Names="Arial" Font-Size="12pt" HorizontalAlign="Center" Width="1024px">
            <asp:Login ID="LoginUser" Class="Login" runat="server" EnableViewState="false" RenderOuterTable="false">
                <div class="accountInfo">
                    <div class="row">
                        <div>
                            <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">Staff ID:</asp:Label>
                        </div>
                        <div>
                            <asp:TextBox ID="UserName" runat="server" CssClass="textEntry" Width="114%" Height="20"></asp:TextBox>
                        </div>
                    </div>

                    <div class="row">
                        <div>
                            <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password" Style="padding-top: 4px">Password</asp:Label>
                        </div>
                        <div>
                            <asp:TextBox ID="Password" runat="server" CssClass="passwordEntry" TextMode="Password" Width="114%" Height="20"></asp:TextBox>
                        </div>
                    </div>

                    <div class="row">
                        <telerik:RadButton ID="btnLogin" runat="server" Text="Login" OnClick="RadButton_LoginCheck_Click" RenderMode="Lightweight" Width="93%" Font-Size="X-Large" Skin="Silk" Height="35px" Font-Names="Arial"></telerik:RadButton>
                    </div>
                </div>
            </asp:Login>
        </asp:Panel>
    </div>
</telerik:RadAjaxPanel>

aspx.vb:

Protected Sub btnLogin_Click(sender As Object, e As System.EventArgs) Handles btnLogin.Click
    If staffIDRegex.Match(checkStaffId).Success Then
        Panel_Login.Visible = False
        Panel_GoogleAuth.Visible = True
    End If
End Sub

PanelBar

answered on 12 Sep 2025

0 answers

10 views

Telerik UI for ASP.NET AJAX in Jetbrains Rider

I don't see anyone talking about migrating from Visual Studio to Jetbrains Rider using Telerik.

I have a 20+ year project that's had Telerik being used for a long time. When opening the project in Jebrains Rider, there are a lot of referencing issues and a lot of it is messed up, mostly related to telerik. I mainly use the Telerik wizards for Reporting and for the Ajax UI version, which don't exist in Rider. I wanted to see if anyone has any tips or tricks, or if there is talk about creating plugins for telerik on Jetbrains Rider?

General Discussions

asked on 03 Sep 2025

1 answer

11 views

How to pass parameter to OnClientClick function?

How can I pass the number to the confirm popup message like

===============================

Confirm to Delete Record ___(No)___?

===============================

CODE in .aspx

function DeleteConfirm(sender, args) {
args.set_cancel(!confirm('Confirm to Delete?'));
}

</script>

<telerik:RadButton ID="btnDelete" runat="server" Skin="Windows7" Text="Delete" CommandName="Delete"
CommandArgument='<%# Eval("CueId") + "|" + Eval("RevID") + "|" + Eval("No") %>' OnClientClicking="DeleteConfirm" visible='<%# If(Eval("AdminPage").ToString() = "Yes", true, false) %>'
Enabled='<%# If(Eval("ControlStatus").ToString() = "R", true, false) %>' >
</telerik:RadButton>

Button

updated question on 02 Sep 2025

1 answer

14 views

CheckBox, RadRadioButtonList used in radwindow it show double how we restrict

Hi sir,

I open the new page in radwindow. in that new page i add textbox, checkbox, RadRadioButtonList and comobobox.

but CheckBox, RadRadioButtonList it show double how we restrict.

it show in firefox, edge browser.

CheckBox

RadioButtonList

answered on 28 Aug 2025

6 answers

4.3K+ views

Hide a column programmatically

Hi

I have searched the forums and can't see anything that seesm to match my case.

I want to hide a column based on a value set in a settings table. No problem getting the
setting value as true or false, but I can't make the column hidden.

Columns are not autogenerated and the column in question is declared like this

    
            <telerik:GridBoundColumn DataField="StockQuantity" DataType="System.Int16"   
        
                        HeaderText="Stock" SortExpression="StockQuantity"   
        
                        UniqueName="StockQuantity">  
        
            </telerik:GridBoundColumn>

How can this be made visible/invisble from the code behind?
I have tried this below but I think it is applicable only to autogenerated columns.. Anyway it does not do anything.

    
            Protected Sub RadGrid1_ColumnCreated(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridColumnCreatedEventArgs) Handles RadGrid1.ColumnCreated  
        
                    If e.Column.UniqueName = "StockQuantity" Then  
        
                        e.Column.Visible = False 
        
                    End If  
        
                End Sub

Thanks for help here!

Clive

Grid

answered on 27 Aug 2025