The Box Plot Chart throws the following errors when used:
RadHtmlChart.js:1 Uncaught ReferenceError: series is not defined Uncaught (in promise) ReferenceError: series is not defined
I recently upgraded the Telerik version from 2025.1.416 to 2025.3.825, and started getting this NullReferenceException during debugging.
I noticed I get the error when debugging RadGrid with the Skin property.
The problem is that when you click the buttons, the RadDateRangePicker is filled with the start of 2025-06-01 and the end of 2025-06-30. Then, when you click the button again, a change should occur in the RadDateRangePicker: start of 2025-07-01 and end of 2025-07-31.
1 step => correct
2 step => incorrect
Result
The first time you click the button, it returns the start date to 06/01/2025 and the end date to 06/30/2025 (this is correct). Clicking it again returns the start date to 06/30/2025 and the end date to 07/31/2025 (this is incorrect).
Work around
- Local page
js code fixed
const datepicker = $find('<%= radDateRangePicker2.ClientID %>');
datepicker.set_rangeSelectionStartDate(null);
datepicker.set_rangeSelectionEndDate(null);
- Global fixed All controls
C# in extension control
public bool EnableDateResetting
{
get => ViewState["EnableDateResetting"] as bool? ?? false;
set => ViewState["EnableDateResetting"] = value;
}
public eDateRangePicker() : base()
{
Load += EDateRangePicker_Load;
}
private void EDateRangePicker_Load(object sender, EventArgs e)
{
if (EnableDateResetting)
{
RegisterDateResettingScript();
}
}
private void RegisterDateResettingScript()
{
string script = $@"
Sys.Application.add_load(function() {{
const picker = $find('{ClientID}');
if (picker) {{
const origStart = picker.set_rangeSelectionStartDate;
const origEnd = picker.set_rangeSelectionEndDate;
picker.set_rangeSelectionStartDate = function(date) {{
if (date !== null && !this._isResetting) {{
const currentStart = this.get_rangeSelectionStartDate();
const currentEnd = this.get_rangeSelectionEndDate();
if (currentStart || currentEnd) {{
this._isResetting = true;
origStart.call(this, null);
origEnd.call(this, null);
this._isResetting = false;
}}
}}
return origStart.call(this, date);
}};
picker.set_rangeSelectionEndDate = function(date) {{
return origEnd.call(this, date);
}};
}}
}});
";
ScriptManager.RegisterStartupScript(this, GetType(), $"DateResetting_{ClientID}", script, true);
}
ChatGPT recommended "Turn off Telerik’s “old” ARIA settings (they are overly strict and often invalid):"
i removed it and it worked. WTH?
What i supposed to do now? I added these settings in all our products
<telerik:RadGrid ID="grdImpacts" runat="server" EnableAriaSupport="true"
Hello,
Attached my grid code. Most columns are removed for readability
<telerik:RadGrid ID="grdChanges" runat="server" Width="1140"
skin="WebBlue" style="margin-top:13px; margin-right:13px; outline: 0 !important;"
ShowFooter="false" AllowSorting="false">
<ClientSettings>
<Scrolling AllowScroll="True" ScrollHeight="487px" UseStaticHeaders="true" />
</ClientSettings>
<MasterTableView GroupLoadMode="Client" AutoGenerateColumns="False" HeaderStyle-Font-Bold="true">
<HeaderStyle CssClass="InnerHeaderStyle"/>
<ItemStyle CssClass="InnerItemStyle"/>
<AlternatingItemStyle CssClass="InnerAlernatingItemStyle"/>
<CommandItemStyle CssClass="CommandHeaderStyle" />
<ColumnGroups>
<telerik:GridColumnGroup Name="Passenger Trips" HeaderText="Passenger Trips" HeaderStyle-HorizontalAlign="Center"/>
<telerik:GridColumnGroup Name="Ton Trips" HeaderText="Ton Trips" HeaderStyle-HorizontalAlign="Center"/>
<telerik:GridColumnGroup Name="Miles Per Trip" HeaderText="Miles Per Trip" HeaderStyle-HorizontalAlign="Center"/>
<telerik:GridColumnGroup Name="Miles Per Hour" HeaderText="Miles Per Hour" HeaderStyle-HorizontalAlign="Center"/>
</ColumnGroups>
<Columns>
<telerik:GridNumericColumn DataField="MilesPerHour_Proj" HeaderText="Project"
ColumnGroupName ="Miles Per Hour"
DataFormatString="{0:N1}" DecimalDigits="0"
HeaderStyle-HorizontalAlign="Center"
HeaderStyle-Width="60px" ItemStyle-BackColor="White"
ItemStyle-HorizontalAlign="Right" AllowRounding="true" />
<telerik:GridNumericColumn DataField="MilesPerHour_Base" HeaderText="Base"
ColumnGroupName ="Miles Per Hour"
DataFormatString="{0:N1}" DecimalDigits="0"
HeaderStyle-HorizontalAlign="Center"
HeaderStyle-Width="60px" ItemStyle-BackColor="White"
ItemStyle-HorizontalAlign="Right" AllowRounding="true" />
<telerik:GridNumericColumn DataField="MilesPerHourChange" HeaderText="Change"
ColumnGroupName ="Miles Per Hour"
DataFormatString="{0:N1}" DecimalDigits="0"
HeaderStyle-HorizontalAlign="Center"
HeaderStyle-Width="60px" ItemStyle-BackColor="White"
ItemStyle-HorizontalAlign="Right" AllowRounding="true" />
</Columns>
<NoRecordsTemplate>
<div style="padding: 5px">
No records available.
</div>
</NoRecordsTemplate>
</MasterTableView>
<FilterMenu EnableTheming="True">
<CollapseAnimation Duration="200" Type="OutQuint" />
</FilterMenu>
</telerik:RadGrid>