Originally Posted by
Daniil
I'd suggest:
1. Set up AutoLoad="false" for the stores
2. Set up the following Activate listeners for the tabs:
<Activate Handler="#{GridPanel2}.store.load();" Single="true" />
<Activate Handler="#{GridPanel3}.store.load();" Single="true" />
I'm using filters based on the example
https://examples2.ext.net/ # / GridPanel / multihead / Filter /
Where should I make the call of my function "onLoadGrid" and how to pass the records of the store
<script type="text/javascript">
var applyFilter = function (field, buttonClear) {
var v = field.el.dom.value;
if(field){
var id = field.id,
task = new Ext.util.DelayedTask(function(){
var f = Ext.getCmp(id);
f.focus();
f.el.dom.value = f.el.dom.value;
});
task.delay(100);
}
#{grdMaster}.getStore().filterBy(getRecordFilter());
};
var clearFilter = function () {
#{FilterCD_USUARIO}.reset();
#{FilterAN_EMAIL}.reset();
#{grdMaster}.getStore().clearFilter();
}
var filterString = function (value, dataIndex, record) {
var val = record.get(dataIndex);
if (typeof val != "string") {
return value.length == 0;
}
return val.toLowerCase().indexOf(value.toLowerCase()) > -1;
};
var filterDate = function (value, dataIndex, record) {
var val = record.get(dataIndex).clearTime(true).getTime();
if (!Ext.isEmpty(value, false) && val != value.clearTime(true).getTime()) {
return false;
}
return true;
};
var filterNumber = function (value, dataIndex, record) {
var val = record.get(dataIndex);
if (!Ext.isEmpty(value, false) && val != value) {
return false;
}
return true;
};
var getRecordFilter = function () {
var f = [];
f.push({
filter: function (record) {
return filterString(#{FilterCD_USUARIO}.getValue(), 'CD_USUARIO', record);
}
});
var len = f.length;
return function (record) {
for (var i = 0; i < len; i++) {
if (!f[i].filter(record)) {
return false;
}
}
return true;
};
};
</script>
<ext:GridPanel ID="GridPanel1" runat="server" StripeRows="true" TrackMouseOver="true"
Border="false" Flex="1" AutoExpandColumn="CD_USUARIO" AutoExpandMin="50">
<Store>
<ext:Store runat="server" ID="Store1" >
<Reader>
<ext:JsonReader IDProperty="IdJsonReader">
<Fields>
<ext:RecordField Name="CD_USUARIO" Type="String" />
</Fields>
</ext:JsonReader>
</Reader>
<Listeners>
<Load Handler="onLoadGrid(store, records, #{grdMaster})" Delay="10" />
</Listeners>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel3" runat="server">
<Columns>
<ext:Column ColumnID="CD_USUARIO" Header="Usuário" DataIndex="CD_USUARIO" />
<ext:Column Width="25" DataIndex="CD_USUARIO" Sortable="false" MenuDisabled="true"
Header=" " Fixed="true" Hideable="false" Resizable="False">
<Renderer Handler="return '';" />
</ext:Column>
</Columns>
</ColumnModel>
<View>
<ext:GridView ID="GridView2" runat="server" ForceFit="true" ScrollOffset="0">
<HeaderRows>
<ext:HeaderRow>
<Columns>
<ext:HeaderColumn Cls="x-small-editor">
<Component>
<ext:TextField ID="FilterCD_USUARIO" runat="server" EnableKeyEvents="true" AllowBlank="True">
<Listeners>
<KeyUp Handler="applyFilter(this, #{ClearFilterButton});" Buffer="250" />
</Listeners>
</ext:TextField>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn AutoWidthElement="false">
<Component>
<ext:Button ID="Button1" runat="server" IconCls="CssExtClearFilterButton-d"
ToolTip="Limpar filtro" Flat="true">
<Listeners>
<Click Handler="clearFilter(null);" />
</Listeners>
</ext:Button>
</Component>
</ext:HeaderColumn>
</Columns>
</ext:HeaderRow>
</HeaderRows>
</ext:GridView>
</View>
</ext:GridPanel>