Error on Chart controls (Label , Renderer , Tooltip ) giving parser errors

  1. #1

    Error on Chart controls (Label , Renderer , Tooltip ) giving parser errors

    Using MVC 4 , Ext.net 4.0
    We are in process of upgrading Ext.net 2.0 to 4.0

    Getting following parser errors

    1) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Tooltip' is of type 'System.Web.UI.HtmlControls.HtmlGenericControl'.

    2) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Renderer' is of type 'System.Web.UI.HtmlControls.HtmlGeneriControl'.

    3) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Label' is of type 'System.Web.UI.HtmlControls.HtmlGeneriControl'.

    Example followed from link : https://examples4.ext.net/#/Chart/Column/Basic/

    Code :
       <ext:Panel runat="server" ID="pnlChart" ItemID="pnlChart" Layout="HBoxLayout" Padding="2" Height="335px" Border="false" Region="Center" AutoScroll="true" >
                                <LayoutConfig>
                                    <ext:HBoxLayoutConfig Align="Stretch"></ext:HBoxLayoutConfig>
                                </LayoutConfig>
                                <Items>
                                    <ext:CartesianChart 
                                        ID="Chart1"
                                        runat="server" EnableTheming="true" 
                                        Shadow="true"
                                        StyleSpec="background:#fff"
                                        Animate="true" Flex="4" Margins="5">
                                        <AnimationConfig Easing="BounceOut" Duration="1000" />
                                        <Store>
                                            <ext:Store ID="storeChart" ItemID="storeChart" runat="server" AutoDataBind="true" Data="<%#ViewBag.dtStoreChart%>">
                                                <Model>
                                                    <ext:Model ID="Model1" runat="server">
                                                        <Fields>
                                                            <ext:ModelField Name="id" />
                                                            <ext:ModelField Name="val" />
                                                        </Fields>
                                                    </ext:Model>
                                                </Model>
                                            </ext:Store>
                                        </Store>
    
                                        <Axes>
                                            <ext:NumericAxis
                                                Fields="val"
                                                Grid="true"
                                                Title=""
                                                Minimum="0" AdjustByMajorUnit="true" Maximum="<%#ViewBag.MaxLabelCount%>" AutoDataBind="true">
                                                <Label>
                                                    <Renderer Handler="return Ext.util.Format.number(value, '0,0');" />
                                                </Label>
                                            </ext:NumericAxis>
    
                                            <ext:CategoryAxis
                                                Position="Bottom"
                                                Fields="id"
                                                Title="US Label Count">
                                                <%--<Label>
                                                   <Rotate Degrees="270" />
                                               </Label>--%>
                                            </ext:CategoryAxis>
                                        </Axes>
    
                                        <Series>
                                            <ext:BarSeries
                                                <%--Axis="Left"--%>
                                                Highlight="true"
                                                XField="id"
                                                YField="val">
    
                                                
                                               <Tooltip ID="Tips1" runat="server" TrackMouse="true" Width="140" Height="28">
                                                    <%--<Renderer Handler="this.setTitle(storeItem.get('id') + ': ' + storeItem.get('val'));" />--%>
                                                    <Renderer Handler="this.setTitle(storeItem.get('val') + ' ' + (storeItem.get('id').toLowerCase()=='uk spc' ? storeItem.get('id') : (storeItem.get('id')+ ' Labels')));" />
                                               </Tooltip>
                                                <Label
                                                    Display="InsideEnd"
                                                    Field="val"
                                                    Orientation="Horizontal"
                                                    Color="#333"
                                                    <%--Contrast="true"--%>
                                                    >
    
                                                    <Renderer Handler="return Ext.util.Format.number(value, '0');" />
                                                </Label>
                                                <Renderer Fn="barRenderer" />
                                            </ext:BarSeries>
                                        </Series>
                                    </ext:CartesianChart>
                                    <ext:CartesianChart
                                        runat="server"
                                        Shadow="true" EnableTheming="true" 
                                        StyleSpec="background:#fff"
                                        Animate="true" Flex="4" Margins="5">
                                        <AnimationConfig Easing="BounceOut" Duration="1000" />
                                        <Store>
                                            <ext:Store ID="storeChartUk" ItemID="storeChartUk" runat="server" AutoDataBind="true" Data="<%#ViewBag.dtStoreChartUk%>">
                                                <Model>
                                                    <ext:Model runat="server">
                                                        <Fields>
                                                            <ext:ModelField Name="id" />
                                                            <ext:ModelField Name="val" />
                                                            <%--<ext:ModelField Name="archived" />
                                                            <ext:ModelField Name="current" />--%>
                                                        </Fields>
                                                    </ext:Model>
                                                </Model>
                                            </ext:Store>
                                        </Store>
    
                                        <Axes>
                                            <ext:NumericAxis
                                                Fields="val"
                                                Grid="true"
                                                Title=""
                                                Minimum="0" AdjustByMajorUnit="true" Maximum="<%#ViewBag.MaxSPCCount%>" AutoDataBind="true">
                                                <Label>
                                                    <Renderer Handler="return Ext.util.Format.number(value, '0,0');" />
                                                </Label>
                                            </ext:NumericAxis>
    
                                            <ext:CategoryAxis
                                                Position="Bottom"
                                                Fields="id"
                                                Title="UK SPC Count" />
                                        </Axes>
                                        
                                        <%--<Background Fill="rgb(232,246,252)" StandardTheme="Category5" />--%>
    
                                        <Series>
                                            <ext:BarSeries
                                                <%--Axis="Left" --%>
                                                Stacked="true"
                                                Highlight="true"
                                                XField="id"
                                                YField="val">
                                                <%--<Tooltip ID="Tips3" runat="server" TrackMouse="true" Width="140" Height="28">--%>
                                                    <Renderer Handler="this.setTitle(storeItem.get('val') + ' ' + (storeItem.get('id').toLowerCase()=='uk SPC' ? storeItem.get('id') : (storeItem.get('id')+ ' SPCs')));" />
                                                    <%--<Renderer Handler="this.setTitle(String(item.value[1] / 1000000) + 'M');" />--%>
                                                <%--</Tooltip>--%>
                                                <Label
                                                    Display="InsideEnd"
                                                    Field="val"
                                                    Orientation="Horizontal"
                                                    Color="#333"
                                                    <%--Contrast="true"--%>
                                                    >
                                                    <Renderer Handler="return Ext.util.Format.number(value, '0');" />
                                                </Label>
                                                <Renderer Fn="barRenderer" />
                                            </ext:BarSeries>
                                        </Series>
                                    </ext:CartesianChart>
                                    <ext:CartesianChart
                                        ID="Chart2"
                                        runat="server"
                                        Shadow="true"
                                        StyleSpec="background:#fff"
                                        Animate="true" Flex="3" Margins="5">
                                        <AnimationConfig Easing="BounceOut" Duration="1000" />
                                        <Store>
                                            <ext:Store ID="storeChart2" ItemID="storeChart2" runat="server" AutoDataBind="true" Data="<%#ViewBag.dtStoreChart2%>">
                                                <Model>
                                                    <ext:Model ID="Model2" runat="server">
                                                        <Fields>
                                                            <ext:ModelField Name="id" />
                                                            <ext:ModelField Name="val" />
                                                        </Fields>
                                                    </ext:Model>
                                                </Model>
                                            </ext:Store>
                                        </Store>
    
                                        <%--<Background Fill="rgb(242,250,252)" />--%>
    
                                        <Axes>
                                            <ext:NumericAxis
                                                Fields="val"
                                                Grid="true"
                                                Title="" AutoDataBind="true"
                                                Minimum="0" Maximum="<%#ViewBag.WeeklyUpdateMax%>" AdjustByMajorUnit="true">
                                                <Label>
                                                    <Renderer Handler="return Ext.util.Format.number(value, '0,0');" />
                                                </Label>
                                            </ext:NumericAxis>
    
                                            <ext:CategoryAxis
                                                Position="Bottom"
                                                Fields="id"
                                                Title="Weekly Stats" />
                                        </Axes>
    
                                        <Series>
                                            <ext:BarSeries
                                                <%--Axis="Left"--%>
                                                Highlight="true"
                                                XField="id"
                                                YField="val">
                                                <%--<Tooltip ID="Tips2" runat="server" TrackMouse="true" Width="130" Height="40">--%>
                                                    <%--<Renderer Handler="this.setTitle(storeItem.get('val') + ' ' + storeItem.get('id') +' Labels <br> Click to view');" />--%>
                                                    <%-- +'<br> Click to view details'--%>
                                               <%-- </Tooltip>--%>
                                                <Label
                                                    Display="InsideEnd"
                                                    Field="val"
                                                    Orientation="Horizontal"
                                                    Color="#333"
                                                   <%-- Contrast="true"--%>
                                                    >
                                                    <Renderer Handler="return Ext.util.Format.number(value, '0');" />
                                                </Label>
                                                <Listeners>
                                                    <ItemClick Handler="welcomeScreen.fillWeeklyStatsGrid(item);"></ItemClick>
                                                </Listeners>
                                                <Renderer Fn="barRenderer" />
                                            </ext:BarSeries>
                                        </Series>
                                    </ext:CartesianChart>
    
                                </Items>
                            </ext:Panel>
  2. #2
    Hello @sohelvali! Welcome to Ext.NET forums!

    Please do no add comments inside of tags of ASPX controls, they are known not to work.

    Here's a little more about this: StackOverflow question - Can I place a comment inside a tag in ASP.NET?

    I hope this helps! If not, just strip your code of all <%-- --%> comments you added and you'll see how the errors changes (or stop happening at all).
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. [CLOSED] Parser error in runtime
    By vadym.f in forum 3.x Legacy Premium Help
    Replies: 2
    Last Post: Sep 03, 2015, 6:37 PM
  2. Replies: 1
    Last Post: Sep 13, 2012, 6:38 PM
  3. [CLOSED] Infinite Scrolling throwing Parser Error
    By rnachman in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: Sep 03, 2012, 5:19 PM
  4. Replies: 5
    Last Post: Jan 05, 2012, 10:03 AM
  5. Replies: 2
    Last Post: Sep 15, 2010, 8:38 AM

Tags for this Thread

Posting Permissions