PDA

View Full Version : [FIXED] [V0.8.0] GridPanel scrollbar



methode
Mar 04, 2009, 5:58 AM
Hi Vlad,

please, check the following code. I reproduced the error.

Now in a GridPanel with vertical scrollbar, if people click the last row, scrollbar scrolls to top.

The effect is as it executes a code like that:




gridPanel.getView().scrollToTop();



Thanx

Matteo

Steps:

- scroll to bottom
- click row
- scrollbar scrolls to top




// DESIGN

<ext:ScriptManager ID="ScriptManager1" runat="server" AjaxViewStateMode="Include" />
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="Name" />
<ext:RecordField Name="Price" />
<ext:RecordField Name="Change" />
<ext:RecordField Name="PctChange" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<br />
<h1>scrollbar grid</h1>
<ext:GridPanel ID="GridPanel2" runat="server" StoreID="Store1" StripeRows="true"
Title="Company List" Width="600" Height="200">
<SelectionModel>
<ext:RowSelectionModel ID="rowSel" runat="server"></ext:RowSelectionModel>
</SelectionModel>
<ColumnModel ID="ColumnModel2" runat="server">
<Columns>
<ext:Column ColumnID="Company" Header="Company" Sortable="true" DataIndex="Name" />
<ext:Column Header="Price" Sortable="true" DataIndex="Price">
<Renderer Format="UsMoney" />
</ext:Column>
<ext:Column Header="Change" Sortable="true" DataIndex="Change">
<Renderer Fn="change" />
</ext:Column>
<ext:Column Header="Change" Sortable="true" DataIndex="PctChange">
<Renderer Fn="pctChange" />
</ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>

// CODE

protected void Page_Load(object sender, EventArgs e)
{
Company _c = new Company("3m Co", 71.72, 0.02, 0.03);
Company _c1 = new Company("Coolite Inc.", 79.72, 0.02, 0.03);
List<Company> _l = new List<Company>();
_l.Add(_c);
_l.Add(_c1);
_l.Add(_c);
_l.Add(_c1);
_l.Add(_c);
_l.Add(_c1);
_l.Add(_c);
_l.Add(_c1);
_l.Add(_c);
_l.Add(_c1);

this.Store1.DataSource = _l;
this.Store1.DataBind();
}


public class Company
{
private string _name;

public string Name
{
get { return _name; }
set { _name = value; }
}
private double _price;

public double Price
{
get { return _price; }
set { _price = value; }
}
private double _change;

public double Change
{
get { return _change; }
set { _change = value; }
}
private double _pctChange;

public double PctChange
{
get { return _pctChange; }
set { _pctChange = value; }
}

public Company(string name, double price, double change, double pctChange)
{
this.Name = name;
this.Price = price;
this.Change = change;
this.PctChange = pctChange;
}


}

Vladimir
Mar 04, 2009, 8:21 AM
Hi Matteo,

It seems it is ExtJS bug.
The single way which I found is comment some code in focusCell function of GridView


  <script type="text/javascript">
        var focusCell = function(row, col, hscroll){
            this.syncFocusEl(this.ensureVisible(row, col, hscroll));
           // if(Ext.isGecko){
           //     this.focusEl.focus();
           // }else{
           //     this.focusEl.focus.defer(1, this.focusEl);
           // }
        }
    </script>


           <View>
                <ext:GridView runat="server">
                    <CustomConfig>
                        <ext:ConfigItem Name="focusCell" Value="focusCell" Mode="Raw" />
                    </CustomConfig>
                </ext:GridView>
            </View>     


We will investigate it more but I think need to wait fix from ExtJS team

methode
Mar 04, 2009, 11:50 AM
 Hi Vlad,

perfect!


Well, about the bug, of course you're aware of that, I'd say that with some builds/revisions ago there wasn't.
I'm quite sure about it. Hope it is of some help.


Thanks a lot


Matteo

Vladimir
Mar 04, 2009, 11:58 AM
Just recently we refreshed ExtJS core files (last updated files from ExtJS). I think it is a reson that this bug occurs in last version of toolkit.

Vladimir
Mar 05, 2009, 9:49 AM
Hi Matteo,

We fixed it, please update from the SVN
 

methode
Mar 05, 2009, 10:10 AM
done it! it works fine

thanx

Matteo