Questions on UI for ASP.NET AJAX Forum

2 answers

189 views

HTMLChart Label display NaN (not a number)

I have a chart that is getting data from a SQL database in codebehind. Everything displays correctly and the series have the correct number on hover.

It is a stacked bar with the Show totals work a round found on this site.

http://www.telerik.com/support/kb/aspnet-ajax/chart-%28html5%29/details/displaying-grand-total-in-stacked-series-labels-and-pie-series-legend

I know the data coming from SQL is a number because I'm casting it to decimal.

The gTotal shows: "TL bbl: NaN"

Any Ideas?

code behind:

Dim daFMChart As New SqlDataAdapter(SQLFM, Conn)
daFMChart.Fill(DTFMChart)

Me.ColumnChart.DataSource = DTFMChart
Me.ColumnChart.DataBind()

The SQL data is this:

DateTime TotalRed TotalWhite gTotal

2016-03-25 20000 3 0.0001

2016-03-24 30000 2601 0.0001

2016-03-23 50000 45626 0.0001

2016-03-22 10000 55568 0.0001

2016-03-21 30000 54098 0.0001

2016-03-20 10000 51351 0.0001

2016-03-19 20000 21973 0.0001

<telerik:RadHtmlChart runat="server" ID="ColumnChart" Transitions="true" Skin="Silk" Visible="false" Style="width: 100%; height: 100%;">

<ChartTitle Text="Daily Volume Total Per Meter">

<Appearance Align="Right" Position="Top">

<TextStyle Color="#999999" />

</Appearance>

</ChartTitle>

<Legend>

<Appearance Position="Right" Visible="true">

<TextStyle Color="#999999" />

</Appearance>

</Legend>

<PlotArea>

<Series>

<telerik:ColumnSeries Name="FM Red" DataFieldY="TotalRed" Stacked="true">

<LabelsAppearance Visible="false"></LabelsAppearance>

<Appearance>

<FillStyle BackgroundColor="#ff1a1a"></FillStyle>

</Appearance>

</telerik:ColumnSeries>

<telerik:ColumnSeries Name="FM White" DataFieldY="TotalWhite">

<LabelsAppearance Visible="false"></LabelsAppearance>

<Appearance>

<FillStyle BackgroundColor="#bfbfbf"></FillStyle>

</Appearance>

</telerik:ColumnSeries>

<telerik:ColumnSeries DataFieldY="gTotal" Stacked="true">

<Appearance FillStyle-BackgroundColor="#DDD9C3"></Appearance>

<LabelsAppearance Position="OutsideEnd">

<TextStyle Color="#999999" />

<TextStyle Margin="0" />

<ClientTemplate>

TL bbls: #=dataItem.TotalRed + dataItem.TotalWhite#

</ClientTemplate>

</LabelsAppearance>

<TooltipsAppearance Visible="false">

</TooltipsAppearance>

</telerik:ColumnSeries>

</Series>

<XAxis DataLabelsField="DateTime"></XAxis>

<XAxis>

<MajorGridLines Visible="false" />

<MinorGridLines Visible="false" />

<LabelsAppearance Step="1">

<TextStyle Color="#999999" />

</LabelsAppearance>

</XAxis>

<YAxis>

<MajorGridLines Visible="true" Color="#555555" />

<MinorGridLines Visible="false" />

<LabelsAppearance Step="1">

<TextStyle Color="#999999" />

</LabelsAppearance>

</YAxis>

</PlotArea>

<ChartTitle Text=""></ChartTitle>

</telerik:RadHtmlChart>

Chart (HTML5)

answered on 30 Mar 2016

1 answer

165 views

Controls collection Cannot be modified

Hi i am Akhtar Abbas i am using telerik controls in my ASP.NET web application. I am currently designig a login page i am using RadStyleSheetManager, RadAjaxManager, RadAjaxLoadingPanel and RadCodeBlock. the HTML for the page is below

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="AccessCenter.Login" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta charset="utf-8">

    <title>Log In</title>
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
      <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
</head>
<body>
    <div class="wrapper">
        <div class="back1">

            <p class="title">Evac</p>
            <form runat="server" id="form1" class="login">
                <asp:ScriptManager runat="server" ID="smLogin"></asp:ScriptManager>

                <telerik:RadStyleSheetManager runat="server">
                    <StyleSheets>
                        <telerik:StyleSheetReference Path="css/normalize.css" />
                        <telerik:StyleSheetReference Path="css/login.css" />
                    </StyleSheets>
                </telerik:RadStyleSheetManager>

                <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
                    <AjaxSettings>
                        <telerik:AjaxSetting AjaxControlID="btnLogin">
                            <UpdatedControls>
                                <telerik:AjaxUpdatedControl ControlID="form1" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>
                                <telerik:AjaxUpdatedControl ControlID="txtUserName"></telerik:AjaxUpdatedControl>
                                <telerik:AjaxUpdatedControl ControlID="txtPassword"></telerik:AjaxUpdatedControl>
                            </UpdatedControls>
                        </telerik:AjaxSetting>
                    </AjaxSettings>
                </telerik:RadAjaxManager>

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

                <asp:TextBox runat="server" ID="txtUserName" placeholder="Username" autofocus></asp:TextBox>

                <asp:TextBox runat="server" ID="txtPassword" placeholder="Password"></asp:TextBox>

                <asp:TextBox runat="server" ID="txtCaptcha" CssClass="captcha-fld"></asp:TextBox>

                <asp:TextBox runat="server" ID="txtCaptchaText" CssClass="captcha-fld-type"></asp:TextBox>

                <button>
                    <i class="spinner"></i>
                    <asp:Button runat="server" ID="btnLogin" CssClass="login-submit" OnClick="btnLogin_Click" />
                </button>
                <asp:Label ID="lblError" runat="server" ForeColor="Red" Visible="false"></asp:Label>
                <a href="#">Forgot your password?</a>
                <a class="right2" href="#">Sign Up</a>

                <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
                    <script src="js/index.js" type="text/javascript"></script>
                </telerik:RadCodeBlock>
            </form>
        </div>
        <footer></footer>
    </div>
    <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
</body>
</html>

I also have added settings in web.config.

<system.web>

<system.webServer>
    <validation validateIntegratedModeConfiguration="false"/>
    <modules>
      <remove name="ApplicationInsightsWebTracking"/>
      <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler"/>
    </modules>
    <handlers>
      <add name="Telerik_Web_UI_DialogHandler_aspx" verb="*" preCondition="integratedMode" path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler"/>
      <add name="Telerik_Web_UI_SpellCheckHandler_axd" verb="*" preCondition="integratedMode" path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler"/>
      <add name="Telerik_Web_UI_WebResource_axd" verb="*" preCondition="integratedMode" path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource"/>
    </handlers>
</system.webServer>

when i load my page then i have got the following error on the page

The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

How to resolve this?

Note: These controls are purchased controls

I neet urgent responce please reply me as fast as possible because i have deadline of the project

General Discussions

answered on 30 Mar 2016

1 answer

84 views

Give resource a color that is comming from Entity Data Source

I am loading dynamic resources from and entity data source but I wish to give them an individual color how do i map a resource style dyanmcially

01.<asp:UpdatePanel ID="UpdatePanel1" runat="server">

02. <ContentTemplate>

03. <telerik:RadScheduler OnTimeSlotCreated="apertureAppointments_TimeSlotCreated" OverflowBehavior="Auto" runat="server" WeekView-ShowDateHeaders="true" EnableResize="false" ID="apertureAppointments"

04. TimelineView-UserSelectable="false" DayView-UserSelectable="true" AgendaView-UserSelectable="True" DataKeyField="ID" DataSubjectField="Subject" AllowInsert="false" AllowDelete="false" AllowEdit="false"

05. DataStartField="Start" DataEndField="End" DataRecurrenceField="RecurrenceRule" DayView-EnableExactTimeRendering="true" WeekView-UserSelectable="True"

06. DataRecurrenceParentKeyField="RecurrenceParentID" DataSourceID="EntityDataSource1" StartInsertingInAdvancedForm="True" MonthView-UserSelectable="True" AgendaView-NumberOfDays="5"

07. RenderMode="Classic" EnableExactTimeRendering="True"

08. DayStartTime="09:00:00" ShowFooter="false" DayEndTime="18:00" FirstDayOfWeek="Monday" LastDayOfWeek="Friday" HoursPanelTimeFormat="HH:mm tt" MinutesPerRow="30" TimeLabelRowSpan="2" OnAppointmentClick="apertureAppointments_AppointmentClick" OnTimeSlotContextMenuItemClicking="apertureAppointments_TimeSlotContextMenuItemClicking"

09. EnableDescriptionField="true" AppointmentStyleMode="Default" Skin="Metro"

10. >

11.

12. <ExportSettings OpenInNewWindow="True">

13. <Pdf PageBottomMargin="1in" PageLeftMargin="1in" PageRightMargin="1in" PageTopMargin="1in" />

14. </ExportSettings>

15. <AdvancedForm Modal="True" />

16.

17. <TimeSlotContextMenuSettings EnableDefault="false" />

18. <AppointmentContextMenuSettings EnableDefault="false" />

19. <DayView EnableExactTimeRendering="True" />

20.

21. <ResourceTypes>

22. <telerik:ResourceType KeyField="lookup_code" Name="Managers" TextField="lookup_description" ForeignKeyField="managerId"

23. DataSourceID="ManagersDataSource"></telerik:ResourceType>

24. </ResourceTypes>

25. </telerik:RadScheduler> </ContentTemplate>

26. </asp:UpdatePanel>

27.

28. <asp:EntityDataSource runat="server" ID="EntityDataSource1" ConnectionString="name=aperturenetEntities"

29. DefaultContainerName="aperturenetEntities" EntitySetName="Appointments" EnableDelete="true"

30. EnableInsert="true" EnableUpdate="true">

31. </asp:EntityDataSource>

32.

33. <asp:SqlDataSource ID="RoomsDataSource" runat="server"

34. ProviderName="System.Data.SqlClient" ConnectionString="<%$ ConnectionStrings:aperturenetSql %>"

35. SelectCommand="SELECT * FROM [Rooms]"></asp:SqlDataSource>

36.

37. <asp:SqlDataSource ID="ManagersDataSource" runat="server"

38. ConnectionString="<%$ ConnectionStrings:aperturenetSql %>" SelectCommand="SELECT * FROM [tblApertureNetLookUps] WHERE lookup_type='11787CA6-DE99-4E0E-83D2-7D96E0FD11A3'"></asp:SqlDataSource>

Scheduler

answered on 30 Mar 2016

1 answer

140 views

Index of column

Does the IndexOf() method from GridColumnCollection return a zero based index?

What will be returned if the column wasn´t found?

Thanks,

Frank

Remark to: http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/columns/reordering

...

GridColumnCollection cols = grid.MasterTableView.Columns;

GridColumn c = cols.FindByUniqueName(columnName);

if (c != null)

...

FindByUniqueName throws a GridException if the column wasn´t found.

So why testing c for null?

...

Grid

answered on 30 Mar 2016

1 answer

251 views

Change YAxis Step on client-side

Hi

Is it possible to change the yAxis step client-side?

something like

chart._chartObject.options.yAxis.step = 2;

just after obtain the data.

function setDataFromService(sender, args) {

//Get the returned data

var newData = args.get_content().d;

if (newData.length > 0) {

chart._chartObject.options.title.text = newData[0].Name;

//step Y AXIS

chart._chartObject.options.yAxis.step = 2;

}

else

chart._chartObject.options.title.text = "";

//Set the new datasource to the RadHtmlChart

chart.set_dataSource(newData);

//Repaint the RadHtmlChart

chart.repaint();

//Avoid raising the OnClientResponseEnded client-side event

//avoid setting the received data as content for the RadXmlHttpPanel

args.set_cancel(true);

if (currentLoadingPanel != null) {

currentLoadingPanel.hide(currentControl);

}

Chart

<telerik:RadHtmlChart runat="server" ID="DetailChart" ClientIDMode="Static" Transitions="false" RenderAs="Canvas" >

<ChartTitle>

<Appearance Position="Top">

<TextStyle FontSize="9px" Margin="0" Padding="0"/>

</Appearance>

</ChartTitle>

<ClientEvents OnLoad="onChartLoad" />

<Legend>

<Appearance Position="Bottom" Visible="true"></Appearance>

</Legend>

<Pan Enabled="true" />

<Zoom Enabled="true">

<MouseWheel Enabled="true" Lock="Y" />

<Selection Enabled="true" ModifierKey="Shift" />

</Zoom>

<PlotArea>

<Series>

<telerik:ScatterLineSeries DataFieldY="YValue1" DataFieldX="XValue" MissingValues="Zero">

<MarkersAppearance Visible="false" />

<Appearance Overlay-Gradient="None">

<FillStyle BackgroundColor="#e65100" />

</Appearance>

<LineAppearance Width="1px" />

<LabelsAppearance Visible="false"></LabelsAppearance>

<TooltipsAppearance Visible="False"></TooltipsAppearance>

</telerik:ScatterLineSeries>

<telerik:ScatterLineSeries DataFieldY="YValue2" DataFieldX="XValue" MissingValues="Zero">

<MarkersAppearance Visible="false" />

<Appearance Overlay-Gradient="None">

<FillStyle BackgroundColor="#000066" />

</Appearance>

<LineAppearance Width="1px" />

<LabelsAppearance Visible="false"></LabelsAppearance>

<TooltipsAppearance Visible="False"></TooltipsAppearance>

</telerik:ScatterLineSeries>

</Series>

<XAxis BaseUnit="Auto" Type="Date" MaxDateGroups="8">

<MajorGridLines Visible="false" />

<MinorGridLines Visible="false" />

<LabelsAppearance DataFormatString="dd/MM HH:mm" Step="2">

<TextStyle FontSize="10px" />

</LabelsAppearance>

</XAxis>

<YAxis >

<MajorGridLines Visible="true" Width="1" Color="#efefef" />

<MinorGridLines Visible="false" />

<LabelsAppearance >

<TextStyle FontSize="10px" />

</LabelsAppearance>

</YAxis>

</PlotArea>

</telerik:RadHtmlChart>

<telerik:RadXmlHttpPanel runat="server" ID="XmlHttpPanelWCF" WcfRequestMethod="POST" ClientIDMode="AutoID"

OnClientResponseEnding="setDataFromService " WcfServicePath="HomeWebService.asmx" OnClientResponseError="OnClientResponseError"

WcfServiceMethod="GetHomeChartData">

</telerik:RadXmlHttpPanel>

Thank you

Chart (HTML5)

answered on 30 Mar 2016

5 answers

227 views

[Solved] Filter on a column field with a OLAP connection

hi,

I have a pivotgrid connected to an OLAP cube.
I have placed on the columns fields the Year field and I wish to filter this field on a specific year in Code-behind in C #

I browsed the online documentation and the forum but I have not found the proper use for the methods FilterByLabel, FilterByValue, SetFilterIncludes.
I think that the examples provided are suitable for connections to relational databases but not multidimensional.

Could someone tell me how I can implement that kind of filter.

thank you in advance

best regards

PivotGrid

answered on 30 Mar 2016

5 answers

126 views

Looks really bad when zooming

Hi,

The color picker doesn't looks good when zooming in the browser.

Try zooming to 120% and run your demo:

http://demos.telerik.com/aspnet-ajax/colorpicker/examples/overview/defaultcs.aspx

You need to reload the page after zooming!

The Web colors wraps, and the HSB/HSV tabs also wraps a lot!

Regards
Andreas

ColorPicker

answered on 30 Mar 2016

1 answer

87 views

Save RadGauge to PDF

I am running asp.net framework 4.0; Windows 10; Telerik UI for ASP.NET AJAX v2015.2.729.40

In a webforms asp.net project, I have created multiple RadGauges in my C# codebehind, using data pulled from a SQL Server database. Now I need to do one or more of the following:

-save the RadGauges to PDF or as an image file (that can later be emailed)--preferably mutiple gauges per file;

-OR email the gauges

-OR print the gauges

If I can do the FIRST option, I can, obviously do the other two...

I have searched and searched for several days to attempt to do this on my own before sending in a request...and I simply cannot seem to work this out. Can someone assist me? Thanks in advance for any assistance!

Gauge

answered on 30 Mar 2016

8 answers

1.4K+ views

[Solved] Rad grid click row for editing and updating

Hello,

I want to implement that if you click one row,then you can edit, And you click another row, the row you just edited will update and the new row will go into edit mode.

I got some examples, but they just implement it as do one thing at one time.

Anyone can help me I really appreciate it.

Thank you.

Grid