Welcome Guest Search | Active Topics | Sign In | Register

EO.Grid doesn't correctly render rows when some random GridItems have .Disabled = True Options
diego
Posted: Wednesday, January 22, 2014 9:56:10 AM
Rank: Member
Groups: Member

Joined: 4/1/2010
Posts: 18
I'm using the EO.Grid control in my ASP.NET (fw 2.0) application using the EO.Web.dll version 11.0.25.2
I'm having some problems implementing my strategy to filter data on the grid. I have the strict requirement to keep the datasource intact and all I could do to hide/show rows, was just setting the respective property of the GridItem Disabled = true/false, everytime the user presses the Filter button. It was apparently working at first, but finally I realized that the grid was actually failing at rendering data in case some rows were hidden and then followed by visible rows (if the rowset was significantly big). The failure was: messing up with the shown data when moving the scrollbar and breaking any eventual javascript logic bound to the cells event handlers (like begin_edit, end_edit). I included an example below to show what I mean with failing at rendering data. The problem begins when the rowset gets bigger (maybe starting from >100 rows).

You can see the result in this >>>> video <<<< (now with annotations)

Code: HTML/ASPX
<eo:Grid ID="Grid" runat="server" width="500" Height="250">                                               
  <Columns>
    <eo:TextBoxColumn HeaderText="ID" DataField="Field_id" ReadOnly="true" />			             
    <eo:TextBoxColumn HeaderText="Field_1" DataField="Field_1" ReadOnly="true" />			             
    <eo:TextBoxColumn HeaderText="Field_2" DataField="Field_2" ReadOnly="true" />			             
    <eo:TextBoxColumn HeaderText="Field_3" DataField="Field_3" ReadOnly="true" />			             
  </Columns>
</eo:Grid>


Code: C#
protected void Page_Load(object sender, EventArgs e)
    {
        DataTable dt = BuildDataSource(this.Grid);
        FillDataSourceWithRandomValues(dt,400);       
        Grid.DataSource = dt;
        Grid.DataBind();
        FlagRandomItemsDeleted(this.Grid);
    }

    private static void FlagRandomItemsDeleted(EO.Web.Grid grid)
    {
        Random fixRand = new Random();      
        foreach(EO.Web.GridItem item in grid.Items){

            int isDeleted = fixRand.Next(0, 2);

            if (isDeleted == 1)
                item.Deleted = true;
            else
                item.Deleted = false;
        }
    }

    private static void FillDataSourceWithRandomValues(DataTable dt, int iRows) {

        const string idFieldName = "Field_id";

        for (int i = 0; i < iRows; i++)
        {
            DataRow dr = dt.NewRow();
            

            if (dt.Columns.Contains(idFieldName))
                dr[idFieldName] = i;

            foreach (DataColumn column in dt.Columns)
            {                
                string fieldName = column.ColumnName;
                if (fieldName == idFieldName)
                    continue;
                string fieldValue = "random";
                dr[fieldName] = fieldValue;
            }
            dt.Rows.Add(dr);
        }        
    }
    
    private static DataTable BuildDataSource(EO.Web.Grid grid)
    {
        DataTable dt = new DataTable();

        foreach (EO.Web.GridColumn gridColumn in grid.Columns)
        {            
            string columnName = gridColumn.DataField;

            if (!string.IsNullOrEmpty(columnName))
            {
                DataColumn column = new DataColumn(columnName, typeof(string));
                dt.Columns.Add(column);
            }
        }

        return dt;
    }
diego
Posted: Thursday, January 23, 2014 2:19:37 AM
Rank: Member
Groups: Member

Joined: 4/1/2010
Posts: 18
I still didn't get any reply and maybe my post was not clear enough. I want to be sure you understand that I'm using the same approach already suggested here in the support forum to filter rows in the grid. The strategy involves the Deleted property of the GridItem to show/hide a specific row in the grid. Unfortunately it doesn't work really well as described in my post above. Is there something I'm doing wrong? Maybe I should do it during another stage of the page life cycle? Is there a solution to overcome the problem I'm experiencing? Or maybe my demo above is not clear and I should try to better describe my problem?
eo_support
Posted: Thursday, January 23, 2014 8:30:51 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,196
Thanks for the additional information. We are looking into this and will post again as soon as we have an update.
eo_support
Posted: Friday, January 24, 2014 12:46:47 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,196
Hi,

We have posted a new build that should fix this problem. Please see your private message for the download location.

Thanks!
diego
Posted: Friday, January 24, 2014 8:31:45 AM
Rank: Member
Groups: Member

Joined: 4/1/2010
Posts: 18
Thank you for your support. I got your reply, downloaded the package and included the new dll in my project. I have to say that I could see immediately the first problem solved. Now the Grid can correctly render big rowsets even when some of the rows may have the Deleted property set to false. Unfortunately, in this same scenario, it still fails handling javascript logic bound to the begin/end edit events of a CustomColumn.

I crafted a similar demo just for the sake of showing this javascript issue. It's a much simpler grid but now it involves the js event handlers needed for the edit strategy of the CustomColumn.

This is the video showing the problem while running this demo - http://www.youtube.com/watch?v=uJ55GA5mw8w (with annotations)

Code: JavaScript
function editable_on_column_gettext(column, item, cellValue) {
        return cellValue;
    }

    function editable_on_begin_edit(cell) {
        var inputBox = document.getElementById('editable_input');
        var v = cell.getValue();
        if (v == null) v = '';
        inputBox.value = v;
    }

    function editable_on_end_edit(cell) {
        var inputBox = document.getElementById('editable_input');
        return inputBox.value;      
    }


Code: HTML/ASPX
<eo:Grid runat="server" id="Grid1" Width="200" Height="250" FullRowMode="False">		
	    <Columns>
		    <eo:StaticColumn Width="60" HeaderText="ID"></eo:StaticColumn>
		    <eo:CustomColumn Width="100" HeaderText="Editable"            
                        ClientSideGetText="editable_on_column_gettext"
	                ClientSideEndEdit="editable_on_end_edit"
	                ClientSideBeginEdit="editable_on_begin_edit">
			    <EditorTemplate>
				    <input id="editable_input" type="text" style="width:90px;"/>					
			    </EditorTemplate>
		    </eo:CustomColumn>
	    </Columns>	
</eo:Grid>


Code: C#
protected void Page_Load(object sender, EventArgs e)
    {
        Grid1.DataSource = BuildDataSource(500);    
        Grid1.DataBind();
        FlagRandomItemsDeleted(this.Grid1);
    }

    private static List<object> BuildDataSource(int nRows)
    {
        List<object> rowset = new List<object>();
        for(int i = 0; i < nRows; i++){
            rowset.Add(new object[]{i, "random"});
        }
        return rowset;
    }

    private static void FlagRandomItemsDeleted(EO.Web.Grid grid)
    {
        Random fixRand = new Random();
        foreach (EO.Web.GridItem item in grid.Items)
        {
              item.Deleted = (fixRand.Next(0, 2) == 0) ? true : false;
        }
    }
eo_support
Posted: Saturday, January 25, 2014 10:42:27 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,196
Hi,

We have posted a new build that should fix the problem. You can download the new build from our download page.

Thanks!
diego
Posted: Monday, January 27, 2014 5:24:04 AM
Rank: Member
Groups: Member

Joined: 4/1/2010
Posts: 18
Thank you :) problems solved.
eo_support
Posted: Monday, January 27, 2014 11:21:50 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,196
Great. Thanks for the update!


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.