This happens because PagingToolbar doesn't listen 'clear' event sended when calling method removeAll. You can check it here in method bindStore:
http://docs.sencha.com/ext-js/3-4/so...-PagingToolbar.
You can override this behavior check following code:
<script runat="server">
protected void Store_RefreshData(object sender, StoreRefreshDataEventArgs e)
{
Store store = this.GridPanel1.GetStore();
object[] newVariable = new object[]
{
new object[] { "test1" },
new object[] { "test2" },
new object[] { "test3" },
new object[] { "test4" },
new object[] { "test5" },
new object[] { "test6" },
new object[] { "test7" },
new object[] { "test8" },
new object[] { "test9" }
};
e.Total = newVariable.Count(); ;
store.DataSource = newVariable.Skip(e.Start).Take(e.Limit);
store.DataBind();
}
</script>
<!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 id="Head1" runat="server">
<title>Ext.NET Example</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" ScriptMode="Debug" SourceFormatting="True" />
<script type="text/javascript">
Ext.override(Ext.PagingToolbar, {
bindStore: function(store, initial) {
var doLoad;
if (!initial && this.store) {
if (store !== this.store && this.store.autoDestroy) {
this.store.destroy();
} else {
this.store.un('beforeload', this.beforeLoad, this);
this.store.un('load', this.onLoad, this);
this.store.un('exception', this.onLoadError, this);
this.store.un('clear', this.onClear, this);
}
if (!store) {
this.store = null;
}
}
if (store) {
store = Ext.StoreMgr.lookup(store);
store.on({
scope: this,
beforeload: this.beforeLoad,
load: this.onLoad,
exception: this.onLoadError,
clear: this.onClear
});
doLoad = true;
}
this.store = store;
if (doLoad) {
this.onLoad(store, null, { });
}
},
onClear: function(s, r) {
this.onLoad(s, r, s.lastOptions.params);
},
getPageData: function() {
var total = this.store.getCount() > 0 ? this.store.getTotalCount() : 0;
return {
total: total,
activePage: Math.ceil((this.cursor + this.pageSize) / this.pageSize),
pages: total < this.pageSize ? 1 : Math.ceil(total / this.pageSize)
};
}
});
</script>
<ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
<TopBar>
<ext:PagingToolbar ID="PagingToolbar2" runat="server" PageSize="3" />
</TopBar>
<Store>
<ext:Store ID="Store1" runat="server" RemotePaging="true" AutoLoad="False" RemoteSort="true"
WarningOnDirty="false" DirtyWarningText="false" ShowWarningOnFailure="false"
OnRefreshData="Store_RefreshData">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name="test" />
</Fields>
</ext:ArrayReader>
</Reader>
<BaseParams>
<ext:Parameter Name="start" Value="0" Mode="Raw" />
<ext:Parameter Name="limit" Value="3" Mode="Raw" />
</BaseParams>
<Proxy>
<ext:PageProxy />
</Proxy>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column Header="Test" DataIndex="test" />
</Columns>
</ColumnModel>
<BottomBar>
<ext:PagingToolbar ID="PagingToolbar1" runat="server" PageSize="3" />
</BottomBar>
</ext:GridPanel>
<ext:Button ID="Button1" runat="server" Text="removeAll">
<Listeners>
<Click Handler="GridPanel1.getStore().removeAll();" />
</Listeners>
</ext:Button>
</form>
</body>
</html>