[1.0] PagingToolBar doesn't render properly

**walle** · Nov 10, 2010, 8:20 PM

Hi,

This is my code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="example.aspx.cs" Inherits="example" %>
<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Example</title>    
</head>
<body>
   <form id="fEmpl" runat="server">
              
   <ext:ResourceManager ID="ResourceManager1" runat="server" />
      
   <ext:Store ID="store_empl" runat="server" AutoLoad="true">
      
      <AutoLoadParams>
        <ext:Parameter Name="start" Value="0" Mode="Raw" />
        <ext:Parameter Name="limit" Value="5" Mode="Raw" />
      </AutoLoadParams>
      
      <Reader>
         <ext:ArrayReader>
            <Fields>                        
               <ext:RecordField Name="getId" />
               <ext:RecordField Name="getName" />
            </Fields>
         </ext:ArrayReader>
      </Reader>            
   </ext:Store>
        
   <ext:GridPanel ID="gridp" runat="server" StoreID="store_empl" Width="755" Height="570" Border="false" StripeRows="true" 
                  TrackMouseOver="true" AutoExpandColumn="name">

      <ColumnModel ID="ColumnModel1" runat="server">
         <Columns>                                                                        
            <ext:Column ColumnID="code" Header="Code" DataIndex="getId" />
            <ext:Column ColumnID="name" Header="Name" DataIndex="getName" />
         </Columns>
      </ColumnModel>
      
      <SelectionModel>
         <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" >                               
         </ext:RowSelectionModel>
      </SelectionModel>      
            
      <BottomBar>
         <ext:PagingToolBar ID="PagingToolBar1" runat="server" PageSize="5" StoreID="store_empl" />
      </BottomBar>
           
  </ext:GridPanel>
           
</form>   
</body>
</html>

 protected void Page_Load(object sender, EventArgs e)
    {
        this.store_empl.DataSource = new object[]
            {
                new object[] { "3m Co", 71.72},
                new object[] { "3m", 71.75},
                new object[] { "5m Co", 71.70},
                new object[] { "9m Co", 71.70},
                new object[] { "13m Co", 71.74},
                new object[] { "233m Co", 71.74},
                new object[] { "343m Co", 71.74},
                new object[] { "1m Co", 71.72},
                new object[] { "56 Co", 71.79},
                new object[] { "6 Co", 71.71},
                
            };

        this.store_empl.DataBind();
    }

As i told you, this code doesn´t work fine on Mozilla Firefox 3.6.12 (but works fine on Internet Explorer 6).

Problem:
The gridPanel and PagingToolBar renders twice.
The first one, the empty gridpanel and toolbar appears on the top of the form for 1-2 second.
And then, displays the full grid with the pagingToolbar on the down of the form.

Obviously, the first one should not appear.
I verified that removing the pagingtoolbar does not appear the problem.

**Daniil** · Nov 16, 2010, 4:39 PM

Hi,

I have reproduced this. I think it's just a delay which is caused when PagingToolbar operates with data. Just we don't see this in IE.

**walle** · Nov 16, 2010, 5:07 PM

Hi Daniil,

I must say that this did not happen in version 0.8.2. but now in Ext.NET (1.0) does.
What do you think about it?

Any solution to this issue, because visually it is a very ugly effect?

Thanks.

**geoffrey.mcgill** · Nov 16, 2010, 6:23 PM

Originally Posted by walle

Any solution to this issue, because visually it is a very ugly effect

We are investigating the problem.

**Vladimir** · Nov 16, 2010, 8:07 PM

Hi,

Try the following code (place to the page head section)

<ext:ResourcePlaceHolder runat="server" Mode="ScriptFiles" />
    
    <script type="text/javascript">
        Ext.PagingToolbar.override({
            onFirstLayout : function(){
                if(this.dsLoaded){
                    (function(){
                      this.onLoad.apply(this, this.dsLoaded);
                    }).defer(1, this);
                }
            }
        });
    </script>

**Vladimir** · Nov 16, 2010, 8:16 PM

Hi,

Improved fix

<script type="text/javascript">
        Ext.PagingToolbar.prototype.initComponent = Ext.PagingToolbar.prototype.initComponent.createSequence(function () {
            if(this.ownerCt instanceof Ext.net.GridPanel){
                this.ownerCt.on('viewready', this.fixFirstLayout, this, {single: true});
            }
            else{
                this.on('afterlayout', this.fixFirstLayout, this, {single: true});
            }
        });
        
        Ext.PagingToolbar.override({
            onFirstLayout : Ext.emptyFn,
            
            fixFirstLayout : function(){
                if(this.dsLoaded){
                    this.onLoad.apply(this, this.dsLoaded);
                }
            }
        });
        
    </script>

**walle** · Nov 16, 2010, 11:36 PM

Hi Vladimir,

Bode codes work fine.

I suppose I have to add it manually to my code, or
can i download it soon from the downloads section (ext.net.community.1.0rc1.zip) with that problem solved?

Thanks.

**Daniil** · Nov 17, 2010, 8:54 PM

Hi,

The fix will be available after next release only (RC2).

Now, please include it in your local source.

**walle** · Mar 30, 2011, 10:40 AM

Hi Daniil,

I thought your solution works fine, but doesn´t.

I have been trying your solution but it doesn´t work sometimes.

Simply, update the page several times and some of them, gridPanel and PagingToolBar renders twice as before.

You can reproduce this with my example above (press repeatedly F5)

Any solution?

Thanks.

**walle** · Apr 06, 2011, 9:02 AM

Please,

Is there any solution for this?

Thanks.

Thread: [1.0] PagingToolBar doesn't render properly

Thread Tools

Search Thread

Display

Similar Threads

[CLOSED] Creating TabStrip Items dynamically in Ext v2.0, but it does NOT render the style properly...

Gridpanel doesn't resize properly

PagingToolbar.PageIndex doesn't work

[CLOSED] [1.0] Initially Hidden fields in CompositeField do not render properly on becoming visible

[CLOSED] spotlight doesn't work properly with window control

Posting Permissions

Sitemap

Downloads

Resources