GridPanel : FilterHeader Bug

  1. #1

    GridPanel : FilterHeader Bug

    Hi,
    adding a filterHeader to a grid panel causes a javascript error.
    I only have a sample in code behind and did not test in aspx :
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Ext.Net;
    namespace WebApplication1
    {
        public partial class WebForm2 : System.Web.UI.Page
        {
            public class Dummy
            {
                public DateTime dt { get; set; }
                public string val0 { get; set; }
                public int val1 { get; set; }
                public int val2 { get; set; }
                public static Ext.Net.Store GetStore()
                {
    
                    return new Store
                    {
                        Model = 
                        { 
                            new Model 
                            {
                                Fields = 
                                        {
                                           new ModelField("dt", ModelFieldType.Date),
                                           new ModelField("val0", ModelFieldType.String),
                                           new ModelField("val1", ModelFieldType.Int),
                                           new ModelField("val2", ModelFieldType.Int)
                                        }
                            }
                        }
    
                    };
    
                }
                public static Ext.Net.ItemsCollection<Ext.Net.ColumnBase> GetColumns()
                {
                    Ext.Net.ItemsCollection<Ext.Net.ColumnBase> Cols = new ItemsCollection<ColumnBase>
                    {
                        new DateColumn
                        {
                            Text = "Date", 
                            DataIndex = "dt",
                           Format="d MMM Y ",
                            Flex = 1
                        },
                        new Column
                        {
                            Text = "Value 0", 
                            DataIndex = "val0",
                            Flex = 1
                        },
                        new Column
    
                        {
                            Text = "Value 1",
                            DataIndex = "val1"
                        },
                        new Column
    
                        {
                            Text = "Value 2",
                            DataIndex = "val2"
                        }
                        
                    };
    
    
                    return Cols;
                }
    
    
            };
            protected void Page_Load(object sender, EventArgs e)
            {
                // creating a dummy store
    
                List<Dummy> mylist = new List<Dummy>();
                DateTime baseDate = new DateTime(DateTime.Now.Year, DateTime.Now.Month, 1);
                for (int i = 0; i < 24; i++)
                {
                    mylist.Add(new Dummy()
                    {
                        dt = baseDate.AddMonths(-i),
                        val1 = i,
                        val2 = (i+1) * 2,
                        val0 = Guid.NewGuid().ToString("N").Substring(0, i + 4)
                    });
                }
    
                //creating a gridpabnel to see store data
                GridPanel gp = new GridPanel()
                {
                    Border = true,
                    Title = "Working OK",
                    MarginSpec = "0 0 3 0",
                    Flex=1,
                    SelectionModel = 
                    { 
                        new RowSelectionModel() { Mode = SelectionMode.Multi }
                    },
    
                    View =
                    {
                       new Ext.Net.GridView()
                       {
                            StripeRows = true,
                            TrackOver = true 
                       }
                    }
                };
                FilterHeader fh = new FilterHeader() { CaseSensitive = false };
                gp.Plugins.Add(fh);
                Store myStore = Dummy.GetStore();
                myStore.ID = "dummyStore";
              
                myStore.DataSource = mylist;
                gp.ColumnModel.Add(Dummy.GetColumns());
                gp.Store.Add(myStore);
                gp.AddTo(this.MyTabPanel);
            }
        }
    }
    code works ok if we remove this:
    FilterHeader fh = new FilterHeader() { CaseSensitive = false };
    gp.Plugins.Add(fh);


    here is the aspx:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication1.WebForm2" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
       
        <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server" />
            <ext:Viewport ID="Viewport1" Layout="border" runat="server">
                <Items>
                    <ext:Container ID="Container1" runat="server" Region="Center" Layout="FitLayout">
                        <LayoutConfig>
                            <%--                    <ext:VBoxLayoutConfig Align="Stretch" DefaultMargins="5 5 5 5" />--%>
                            <ext:FitLayoutConfig DefaultMargins="5 5 5 5" />
                        </LayoutConfig>
                        <Items>
                            <ext:TabPanel runat="server">
                                <Items>
                                    <ext:Panel ID="MyTabPanel" runat="server" Title="Demo KO" Layout="FitLayout" Margins="5" UI="Success">
                                        <TabConfig ID="TabConfig2" runat="server" UI="Danger" />
                                    </ext:Panel>
                                   
                                </Items>
    
                            </ext:TabPanel>
                        </Items>
                    </ext:Container>
                </Items>
            </ext:Viewport>
        </form>
    </body>
    </html>
    here is a visual studio screenshot:

    Click image for larger version. 

Name:	Capture.png 
Views:	47 
Size:	33.5 KB 
ID:	8541

    if we hit "continue", we have no filter:

    Click image for larger version. 

Name:	Capture2.png 
Views:	50 
Size:	15.7 KB 
ID:	8551

    I tested this in a much bigger scenario, same issue, this is why i created this simplified sample.

    I use ext.Net 2.5.

    Have a nice day !
  2. #2
    I cannot reproduce the error and i guess that error is not related with Ext.Net, your page has incorrect symbol
    About FilterHeader:
    - you should use Columns property of ColumnModel to add columns
    gp.ColumnModel.Columns.AddRange(Dummy.GetColumns());
    - AddTo method must be used during direct event only (if need render new dynamic control on the client), please replace it by
    this.MyTabPanel.Items.Add(gp);
    Vladimir Shcheglov
    Sr. Developer
  3. #3
    Hi Vladimir,
    Thank you for your answer.
    I believe it whas a problem with my visual studio ... restatring it solves the problem !!
    Thank your for pointing the errors also!
    Have a nice day, sorry for the wrong bug declaration.

    Have a nice day.
  4. #4
    Hi,

    I believe there might be a problem anyway : i still have the bug on a bigger code: please see screenshot : they show that the invalid char is in a dynamically created javascript created by ext.net :
    Click image for larger version. 

Name:	Capture.png 
Views:	46 
Size:	60.8 KB 
ID:	8581
    Click image for larger version. 

Name:	Capture2.png 
Views:	43 
Size:	24.7 KB 
ID:	8591

    If i click "continue", i see a new wrong char apearing at the end of the file.
    If i click "continue" once again, the 2 wrong chars disapear...

    Those files being generated by Ext.net, i don't understand how it could be my app adding those chars.
    As well, if I remove the code to add a filter header, i do not have this problem anymore:

    the code to add this is very basic:
    FilterHeader fh = new FilterHeader() { };
    gpOP.Plugins.Add(fh);
    Considering the problem happens in a file generated by ext.net, and that removing this peace of code solves the problem I do believe it is an Ext.Net issue.

    I don't know how i could help you reproduce the problem : as I said restarting VS solved the prolem in the sample i created for you... but not in real app...

    Any idea ?
  5. #5
    Actually, looks like a VS2012 bug when debugging with IE:

    http://stackoverflow.com/questions/1...ng-in-internet
    BUT, it is anyway a javascript exception.
    Debugging with Firefox does not create this issue.
  6. #6
    Can you reproduce the error on our Examples Explorer?
    http://examples2.ext.net/
  7. #7
    Hi Daniil,
    i tried to reproduce with your samples but i could not reproduce it; I also tried adding the filterheader from code behind (not in aspx file) because i believe this is what causes the issue... but couldn't reproduce it either.
    Anyway, I will try to create a reproductible sample. One sure thing: happens only on VS 2012, and when debugging with IE.

    It really is strange : looks like Ext.net adds thoses chars and then removes them: here is a step by step:

    1. I add a filter header in code behind.
    2. first issue :
    Click image for larger version. 

Name:	Capture1.PNG 
Views:	32 
Size:	58.8 KB 
ID:	9031
    3. I hit "continue" : causes a second issue : it adds another char:
    Click image for larger version. 

Name:	Capture2.png 
Views:	35 
Size:	57.0 KB 
ID:	9041
    4. i hit "continue" again: the 2 chars are gone !
    Click image for larger version. 

Name:	Capture3.PNG 
Views:	27 
Size:	16.5 KB 
ID:	9051

    I am not sure I can manage to create a reproductible sample, but i will try : do you use VS 2012 ?
  8. #8
    A weird issue. I have no idea.

    Quote Originally Posted by brunweb View Post
    I am not sure I can manage to create a reproductible sample, but i will try : do you use VS 2012 ?
    Yes, I do. My colleagues also have VS 2012 to test with.

Similar Threads

  1. hidden FilterHeader
    By maxdiable in forum 2.x Help
    Replies: 1
    Last Post: Dec 24, 2013, 2:49 AM
  2. Hide/Show FilterHeader Plugin
    By ADV in forum 2.x Help
    Replies: 2
    Last Post: Dec 24, 2013, 2:46 AM
  3. Replies: 1
    Last Post: Nov 23, 2013, 4:09 PM
  4. [CLOSED] FilterHeader Plugin Error
    By leonardm in forum 2.x Premium Help
    Replies: 2
    Last Post: Aug 21, 2013, 5:53 PM
  5. [OPEN] [#308] FilterHeader and infinite scrolling
    By HansWapenaar in forum 2.x Premium Help
    Replies: 16
    Last Post: Aug 05, 2013, 10:56 AM

Tags for this Thread

Posting Permissions